Angular js双向数据绑定

时间:2015-05-08 07:32:27

标签: javascript angularjs

我的角度应用程序的下拉列表中有一些值。我的要求是,当用户从下拉列表中选择任何特定值时,他将获得与该值对应的完整数组。

<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Example - example-$filter-production</title>

    <script src="//ajax.goo gleapis.com/ajax/libs/angularjs/1.4.0- rc.1/angular.min.js"></script>
    <script>
        (function (angular) {
            'use strict';
            angular.module('filterExample', [])
            .controller('MainCtrl', function ($scope, $filter) {
                $scope.originalText = [
                    { name: "Object1", shape: "circle", color: "red" },
                    { name: "Object2", shape: "square", color: "orange" },
                    { name: "Object3", shape: "triangle", color: "yellow" },
                    { name: "Object4", shape: "circle", color: "green" },
                    { name: "Object5", shape: "sphere", color: "blue" },
                    { name: "Object6", shape: "hexagon", color: "indigo" },
                    { name: "Object7", shape: "square", color: "violet" },
                    { name: "Object8", shape: "triangle", color: "red" }
                ]

                //$scope.xxx = {d:'Object1'};
                $scope.xxx = { d: null };
                $scope.filteredText = $filter('filter')($scope.originalText, { name: $scope.xxx.d });
            });
        })(window.angular);
    </script>
</head>

<body ng-app="filterExample">
    <div ng-controller="MainCtrl">
        <h3>{{ originalText }}</h3>
        <h3>{{ filteredText }}</h3>

        <select ng-model="xxx.d" ui-select2="">
            <option ng-repeat="item in originalText" value="{{item.name}}">{{item.name}}</option>"
        </select>

        {{xxx.d}}

    </div>
</body>
</html>

Plunker

中的我的代码

在这里我想要的是,当用户在下拉列表中选择任何特定值时,他应该获得过滤后的数组。

0 个答案:

没有答案