在Angular JS應用程序中添加運算符（>，<，！=等）

-1

我目前有一個基本的Angular應用程序，它在控制器中具有JSON數據並搜索數據條目並返回結果。在Angular JS應用程序中添加運算符（>，<，！=等）

search.html

<body ng-app="mainApp"> 
     <div id="searchBoxes"> 
      Global Search: <input type="text" class="field" ng-model="globalSearch.$"><br> 
      First Name: <input type="text" class="field" ng-model="globalSearch.firstName"><br> 
      Last Name: <input type="text" class="field" ng-model="globalSearch.lastName"><br> 
      Age: <input type="text" class="field" ng-model="globalSearch.Age"><br> 
      Address: <input type="text" class="field" ng-model="globalSearch.Address"><br> 
     </div> 

     <div ng-controller="people"> 
      <ul> 
       <h2> Berman and Co. Contacts </h2> 
       <li ng-repeat="person in persons | filter:globalSearch"> 
        {{ 'Name: ' + person.firstName + ' ' + person.lastName + ' | Age: ' + person.Age + ' | Company: ' + person.Company + ' | Address1: ' + person.Address + ' | Address2: ' + person.City + ', ' + person.State + ' ' + person.Zip }} 
       </li> 
      </ul> 
     </div> 
    </body>

這將更新基於搜索詞在NG-重複顯示的人。我希望能夠進行更復雜的搜索，例如Age > 30或Company != "Amazon"。

這最好是通過輸入和其標籤之間的下拉列表，默認爲=，但可以選擇更改爲>, <, !=, &&, ||等。有沒有辦法在Angular中做到這一點？

這是我app.js供參考：

var app = angular.module('mainApp', []); 

app.controller('people', function($scope) { 
    $scope.persons = rolodex.entries; 
}); 

var rolodex = { 
    "entries": [ 
    { 
     "firstName": "Don", 
     "lastName": "Malbatop", 
     "Age": "36", 
     "Company": "Amazon", 
     "Address": "405 White St", 
     "City": "Washington", 
     "State": "DC", 
     "Zip": "20015" 
    }, 
    { 
     "firstName": "Donna", 
     "lastName": "Montell", 
     "Age": "56", 
     "Company": "National Institute of Health (NIH)", 
     "Address": "456 L St", 
     "City": "Washington", 
     "State": "DC", 
     "Zip": "20016" 
    }, 
     { 
     "firstName": "Rachael", 
     "lastName": "Maple", 
     "Age": "31", 
     "Company": "National Remy Association (NRA)", 
     "Address": "4056 K St", 
     "City": "Washington", 
     "State": "DC", 
     "Zip": "20017" 
    }, 
     { 
     "firstName": "Tammy", 
     "lastName": "Trump", 
     "Age": "47", 
     "Company": "Logo Inc.", 
     "Address": "405 Red St", 
     "City": "Washington", 
     "State": "DC", 
     "Zip": "20015" 
    }, 
     { 
     "firstName": "Jon", 
     "lastName": "Macon", 
     "Age": "37", 
     "Company": "Bill Supply", 
     "Address": "405 Conneticut Ave", 
     "City": "Washington", 
     "State": "DC", 
     "Zip": "20015" 
    }, 
     { 
     "firstName": "Pam", 
     "lastName": "Oliver", 
     "Age": "32", 
     "Company": "Postmates", 
     "Address": "405 Yellow St", 
     "City": "Washington", 
     "State": "DC", 
     "Zip": "20015" 
    }]}

來源

2016-03-07 Virge Assault

我做了它們，所以它似乎並不必要 –

你要求的不是一個簡短的片段，具體細節將從代碼庫到代碼庫有所不同。 StackOverflow對於這個問題並不是一個好地方：在這裏，我們主要回答短小的，技術性的和點對點的疑問。也許最好的方法是問問一個朋友，找一個例子或者嘗試閱讀更一般的文章，直到你找到解決方案=） – slezica

我是Angular的新手，並沒有意識到這將是一個長的答案。例如，ng-show將jQuery中的東西變得相對較長和複雜，變成了2分鐘的解決方案。如果沒有相關的服務/圖書館，我會看看我收到的答案，但不知道如果沒有問。 –

我想你可以創建一個單獨的控制器所選擇的下拉項進行比較，以在新的控制器項目。然後運行您選擇的條件語句（開關/ case，if/else等），並且如果選定的項目與其中一個控制器項目匹配，則運行該操作員。否則，將其設置爲'='運算符。

來源

2016-03-07 22:00:12

在Angular JS應用程序中添加運算符（>，<，！=等）

回答

相關問題