angularjs - Angular filter does not work -

i ran problem angular js project started angular-seed project. here's code snip:

search: <input ng-model="searchtext" placeholder="type in 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> 

the first search box works! second not! don't errors indicate wrong.

when remove ng-controller="myctrl1" markup, both search boxes work! tutorial, angular-phonecat, , angular-seed projects little different. seed project uses kind of code assign controller view.

// declare app level module depends on filters, , 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'});   }]); 

the phonecat project uses ng-controller="myctrl1" markup. don't need declare controller twice, makes sense me remove it.

this fixes problem, why happening?

(also wanted put information in case else runs issue)

in angularjs, each controller creates new scope. need use $parent access model defined @ outer controller if have nested controllers:

<div ng-app ng-controller="myctrl1">search:     <input ng-model="searchtext" placeholder="type in full text search">     <p ng-controller="myctrl1">search:         <input ng-model="$parent.searchtext">showing {{searchtext}}.         <ol>             <li ng-repeat="phone in phones | filter:searchtext">{{phone.name}} ha {{phone.snippet}}</li>         </ol>     </p> </div>