Javascript 在angularJS中实现自动锁定_Javascript_Angularjs

Javascript 在angularJS中实现自动锁定

javascript angularjs

Javascript 在angularJS中实现自动锁定,javascript,angularjs,Javascript,Angularjs,我手里有一个json对象，一行有三个文本框。当我在第一个文本框中输入某个内容时，如果它与对象中的任何数据相匹配，我希望用相应的行填充其余两个文本框。我只想显示一行数据，搜索结果中的大多数匹配行都可以忽略。我尝试了很多方法来实现这一点，但都失败了。我的HTML是这样的 <body ng-app="myApp" ng-controller="MainCtrl"> <div> <div ng-repeat="friendObj in fr

我手里有一个json对象，一行有三个文本框。当我在第一个文本框中输入某个内容时，如果它与对象中的任何数据相匹配，我希望用相应的行填充其余两个文本框。我只想显示一行数据，搜索结果中的大多数匹配行都可以忽略。我尝试了很多方法来实现这一点，但都失败了。我的HTML是这样的

    <body ng-app="myApp" ng-controller="MainCtrl">
    <div>
        <div ng-repeat="friendObj in friends  | filter:search:strict  | limitTo:1">
            <input ng-model="search.name" />
            <input ng-model="friendObj.name" />
            <input ng-model="friendObj.phone" />
        </div>
    </div>
    <div></div>
</body>

我想我还没有达到我的目标。我很困惑ng repeat和filter本身是否是适合此工作的工具？有人能指出实现这一目标的正确方法吗

喜欢


角度.module（'myApp'，[]）.controller（'MainCtrl'，['$http'，'$scope'，函数（$http，$scope）{
$scope.friends=[{
姓名：'约翰'，
电话：555-1276
}, {
姓名：'玛丽'，
电话：“800-BIG-MARY”
}, {
名字：“迈克”，
电话：555-4321
}, {
名字：'亚当'，
电话：555-5678
}, {
姓名：'朱莉'，
电话：555-8765
}, {
名字：“朱丽叶”，
电话：555-5678
}];
$scope.searchTerm=“”；
$scope.currentRowIndex=-1；
$scope.search=函数（）{
for（var i在$scope.friends中）{
if（$scope.friends[i].name.indexOf（$scope.searchTerm）>-1 | |$scope.friends[i].phone.indexOf（$scope.searchTerm）>-1）{
$scope.currentRowIndex=i；
打破
}
}
}
}]);

在第一个文本框中键入“Ju”，显示姓名：“朱莉”，电话：“555-8765”。区分大小写。

My JS Code


    angular.module('myApp', []).controller('MainCtrl', ['$http', '$scope', function ($http, $scope) {
    $scope.friends = [{
        name: 'John',
        phone: '555-1276'
    }, {
        name: 'Mary',
        phone: '800-BIG-MARY'
    }, {
        name: 'Mike',
        phone: '555-4321'
    }, {
        name: 'Adam',
        phone: '555-5678'
    }, {
        name: 'Julie',
        phone: '555-8765'
    }, {
        name: 'Juliette',
        phone: '555-5678'
    }];

}]);

<body ng-app="myApp" ng-controller="MainCtrl">
    <div>
        <input ng-model="searchTerm" ng-change="search()" />
        <input ng-model="friends[currentRowIndex].name" />
        <input ng-model="friends[currentRowIndex].phone" />
    </div>
    <div></div>
</body>


angular.module('myApp', []).controller('MainCtrl', ['$http', '$scope', function ($http, $scope) {
    $scope.friends = [{
        name: 'John',
        phone: '555-1276'
    }, {
        name: 'Mary',
        phone: '800-BIG-MARY'
    }, {
        name: 'Mike',
        phone: '555-4321'
    }, {
        name: 'Adam',
        phone: '555-5678'
    }, {
        name: 'Julie',
        phone: '555-8765'
    }, {
        name: 'Juliette',
        phone: '555-5678'
    }];

    $scope.searchTerm = "";
    $scope.currentRowIndex = -1;
    $scope.search = function () {

        for (var i in $scope.friends) {
            if ($scope.friends[i].name.indexOf($scope.searchTerm) > -1 || $scope.friends[i].phone.indexOf($scope.searchTerm) > -1) {
                $scope.currentRowIndex = i;
                break;
            }

        }

    }

}]);