bootstrap navbar search in other jade file - angularjs

Question

in my Angular JS application, in view folder, in layout.jade file I use bootstrap "nav.navbar.navbar-inverse" from "http://www.tutorialrepublic.com/twitter-bootstrap-tutorial/bootstrap-navbar.php" and I did one change in the following line.
input.form-control(type='text', placeholder='Search')
to
input.form-control(type='text', placeholder='Search' ng-model='searchText')
Then, I use another jade file vieworder.jade, here is the content
extends layout
block content
table.table.table-striped(ng-app="vieworder", ng-controller="viewordercontroller" border='1', cellpadding='7', cellspacing='7')
thead
tr
th(width="10%") Customer Name
th(width="10%") Order Type
th(width="10%") Orders
th(width="10%") Order Date
th(width="10%") Order Status
td(width="10%")
tbody
tr(ng-repeat='Order in Orders | filter:layout.searchText')
td {{ Order.custname }}
td {{ Order.ordertype }}
td {{ Order.noorder }}
td {{ Order.orderdate }}
td {{ Order.orderdate }}
td
a.btn.btn-small.btn-primary(ng-click='cancelOrder(Order.id)') cancel
Now, when I run, I got all the order list in my vieworder page, which is working perfectly. Now I want to apply filter to the table content. For that I use 'searchText' ng-model. But when I type any alphabet to the search field, filter is not working. Please help me..
Here is the controller code
var order = angular.module('vieworder', []);
order.controller('viewordercontroller', function ($scope, $http, $window){
$http.get('/viewalloders').
success(function (data, status, headers, config) {
// this callback will be called asynchronously
// when the response is available
$scope.Orders = data;
console.log(data);
}).
error(function (data, status, headers, config) {
// called asynchronously if an error occurs
// or server returns response with an error status.
console.log("error");
});
console.log("santanu");
$scope.cancelOrder = function (id) {
var path = '/deleteorder/' + id;
var input = [];
input.id = id;
$http.put(path, input).success(function (response) {
console.log("success"); // Getting Success Response in Callback
}).
error(function (response) {
console.log("Santanu :error"); // Getting Error Response in Callback
});
}
});

Answer 1

If you are using same controller for both the views, then you don't need to use layout.searchText. Simply, use searchText since $scope is shared across entire controller. You can directly access it.
If you are using a different controller for both the views, then $scope is different for both the views. In that case you can define your searchText something like:
In your Navbar controller:
$scope.object = {};
$scope.object.SearchText = "someVal";
and then use this as "Order in Orders | filter:'object.searchText'" in your viewOrderController.
Let me know if this doesn't work
Thanks