angular-seed プロジェクトで開始された angular js プロジェクトでこの問題に遭遇しました。コードスニップは次のとおりです。
Search: <input ng-model="searchText" placeholder="Type in a full text search">
<p ng-controller="MyCtrl1">
Search: <input ng-model="searchText">
Showing {{searchText}}.
<ol>
<li ng-repeat="phone in phones | filter:searchText">
{{phone.name}} ha {{phone.snippet}}</li>
</ol>
</p>
最初の検索ボックスが機能します。2番目はそうではありません!何が間違っているかを示すエラーは表示されません。
マークアップを削除するとng-controller="MyCtrl1"
、両方の検索ボックスが機能します! チュートリアル、angular-phonecat、および angular-seed プロジェクトは少し異なります。シード プロジェクトは、この種のコードを使用してコントローラーをビューに割り当てます。
// Declare app level module which depends on filters, and services
angular.module('myApp', ['myApp.filters', 'myApp.services', 'myApp.directives', 'myApp.controllers']).
config(['$routeProvider', function($routeProvider) {
$routeProvider.when('/view1', {templateUrl: 'partials/partial1.html', controller: 'MyCtrl1'});
$routeProvider.when('/view2', {templateUrl: 'partials/partial2.html', controller: 'MyCtrl2'});
$routeProvider.otherwise({redirectTo: '/view1'});
}]);
phonecat プロジェクトはng-controller="MyCtrl1"
マークアップを使用します。明らかに、コントローラーを 2 回宣言する必要はないので、コントローラーを削除することは理にかなっています。
これで問題は解決しましたが、なぜこのようなことが起こるのでしょうか?
(また、他の誰かがこの問題に遭遇した場合に備えて、この情報をSOに入れたいと思いました)