Question

我是AngularJS的新手，我觉得这很简单，但我无法通过网络搜索来了解如何做到这一点。我想要一个文本框，用户可以输入订单号，然后调出与该订单号相关的数据。我有以下控制器，其中包含一些虚拟数据。

(function () {

'use strict';

angular
  .module('crm.ma')
  .controller('LookUpCtrl', LookUpCtrl)
  .filter('lookupFilter', function (){});

function LookUpCtrl($filter) {
    var vm = this;

    vm.results = [
        {
            accountId: 1,
            accountName: 'some name',
            address: '201 some st',
            city: 'Columbus',
            state: 'OH',
            zip: 'zip',
            phone: '899-629-7645',
            parentName: 'Parent 1',
            accountType: 'Type 1',
            accountStatus: 'Status 1',
            creditTerm: 'Term 1',
            ordernumber: '34567'
        },
        {
            accountId: 2,
            accountName: 'house home',
            address: '2963 this st',
            city: 'Columbus',
            state: 'OH',
            zip: 'zip',
            phone: '899-627-7592',
            parentName: 'Parent 2',
            accountType: 'Type 2',
            accountStatus: 'Status 2',
            creditTerm: 'Term 2',
            ordernumber: '43228'
        }
    ];
}
}());

有人能指出我正确的方向吗？

所以你想看看我已经得到了什么：这是我创建的一个表，它使用ng-repeat来显示所有记录。我使用过滤器来搜索表格并根据搜索显示记录。根据我现在想做的事情，我想输入一个特定的顺序＃并提出一个结果。

<div ng-controller="LookUpCtrl as vm">
<div>Lookup Results</div>
<div><input type="text" id="searchText" name="searchText" ng-model="query" /></div>
<table ng-if="query">
    <thead>
        <tr>
            <th>Acc. ID</th>
            <th>Acc. Name</th>
            <th>Acc Address</th>
            <th>City</th>
            <th>State</th>
            <th>Zip</th>
            <th>Phone</th>
            <th>Parent Name</th>
            <th>Account Type</th>
            <th>Account Status</th>
            <th>Credit Term</th>
        </tr>
    </thead>
    <tbody>
        <tr ng-show="results.length!=0" ng-repeat="result in vm.results | filter:query ">
            <td data-th="Acc. ID">{{ result.accountId }}</td>
            <td data-th="Acc. Name">{{ result.accountName }}</td>
            <td data-th="Acc Address">{{ result.address }}</td>
            <td data-th="City">{{ result.city }}</td>
            <td data-th="State">{{ result.state }}</td>
            <td data-th="Zip">{{ reuslt.zip }}</td>
            <td data-th="Phone">{{ result.phone }}</td>
            <td data-th="Parent Name">{{ result.parentName }}</td>
            <td data-th="Account Type">{{ result.accountType }}</td>
            <td data-th="Account Status">{{ result.accountStatus }}</td>
            <td data-th="Credit Term">{{ result.creditTerm }}</td>
        </tr>
        <tr>
            <td ng-show="results.length==0">
                (0) Results found for AccountID {{ result.accountId }}, Order Number {{ result.ordernumber }}
            </td>
        </tr>
    </tbody>
</table>

Answer 1

你已经非常接近了。您只需更新输入的ng-model以隔离要过滤的值。在这种情况下，订单号。

<input type="text" id="searchText" name="searchText" ng-model="query.ordernumber " />

AngularJS通过id一次显示一条记录数据

1 个答案: