bootstrap navbar 在其他 jade 文件中搜索

Question

在我的 Angular JS 应用程序中，在视图文件夹中，在 layout.jade 文件中，我使用来自“http://www.tutorialrepublic.com/twitter-bootstrap-tutorial/bootstrap-navbar.php”的 bootstrap "nav.navbar.navbar-inverse" 我做了一个在以下行中更改。 input.form-控制（类型='text'，占位符='Search'）到 input.form-控制（类型='text'，占位符='Search' ng-模型='searchText'）然后，我用另外一个jade文件vieworder.jade，这里是内容

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

现在，当我运行时，我在查看订单页面中获得了所有订单列表，它运行良好。现在我想对 table 内容应用过滤器。为此，我使用 'searchText' ng-model。但是当我在搜索字段中键入任何字母时，过滤器不起作用。请帮帮我..

这是控制器代码

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

如果您对两个视图使用相同的控制器，则不需要使用 layout.searchText。简单地说，使用 searchText 因为 $scope 在整个控制器之间共享。可以直接访问。

如果您为两个视图使用不同的控制器，则两个视图的 $scope 是不同的。在这种情况下，您可以像这样定义 searchText：

在您的导航栏控制器中：

$scope.object = {};
$scope.object.SearchText = "someVal";

然后在您的 viewOrderController 中将其用作 "Order in Orders | filter:'object.searchText'"。

如果这不起作用请告诉我

谢谢

bootstrap navbar 在其他 jade 文件中搜索

bootstrap navbar search in other jade file

angularjs

pug