AngularJS what'；ng的角色是什么？_Angularjs

AngularJS what'；ng的角色是什么？

angularjs

AngularJS what'；ng的角色是什么？,angularjs,Angularjs,在下面的代码中，当我删除ng模型时，下拉列表中没有任何内容，但是，当我添加ng模型时，我可以看到下拉列表中的内容。这让我对ng模型的作用感到困惑，在这种情况下，我认为只添加ng选项，它会起作用，但实际上不会代码如下： <!doctype html> <html ng-app> <head> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.13/angular.

在下面的代码中，当我删除ng模型时，下拉列表中没有任何内容，但是，当我添加ng模型时，我可以看到下拉列表中的内容。这让我对ng模型的作用感到困惑，在这种情况下，我认为只添加ng选项，它会起作用，但实际上不会

代码如下：

<!doctype html>
<html ng-app>
  <head>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.13/angular.min.js"></script>
    <style type="text/css">
      * {
        box-sizing: border-box;
      }

      body {
        font: 16px/1.5 sans-serif;
        color: #222;
        margin: 5em;
      }

      select {
        width: 40%;
      }

    </style>
  </head>

  <body>

    <div ng-controller="Option">
      <select 
              ng-model= "aa"
              ng-options="person.name for person in people">
        <option value="">Choose a person</option>
      </select>

    </div>


    <script type="text/javascript">

      var Option = function ($scope) {
        $scope.people = [
          {name: "Tom", number: "0199"},
          {name: "Justin", number: "0199"},
          {name: "Jelly", number: "0199"},
        ];
      };

    </script>
  </body>
</html>


* {
框大小：边框框；
}
身体{
字体：16px/1.5无衬线；
颜色：#222；
边缘：5em；
}
挑选{
宽度：40%；
}
选择一个人
变量选项=函数（$scope）{
$scope.people=[
{姓名：“汤姆”，号码：“0199”}，
{姓名：“贾斯汀”，号码：“0199”}，
{名称：“果冻”，编号：“0199”}，
];
};

它是模型和显示控件之间的粘合剂。但也有一些其他的事情：

ngModel负责：

将视图绑定到模型中，其他指令如输入、文本区域或选择“需要”
提供验证行为（即必填项、编号、电子邮件、url）
保持控件的状态（有效/无效、脏/原始、，验证错误）
在元素上设置相关css类（ng有效、ng无效、， ng肮脏，ng质朴）
将控件注册到其父窗体

如文件中所述

ng模型类似于控件的名称或id或属性（选定）

ng选项类似于选择标记的选项标记
而
ng model
有助于显示所选或默认选项值
您的代码应该如下所示
html

Js代码

<script type="text/javascript"> var Option = function ($scope) { $scope.people = [ {name: "Choose a person", number: ""}, {name: "Tom", number: "0199"}, {name: "Justin", number: "0199"}, {name: "Jelly", number: "0199"}, ]; $scope.aa= $scope.people[0]; }; </script>

变量选项=函数（$scope）{ $scope.people=[ {姓名：“选择一个人”，号码：}， {姓名：“汤姆”，号码：“0199”}， {姓名：“贾斯汀”，号码：“0199”}， {名称：“果冻”，编号：“0199”}， ]; $scope.aa=$scope.people[0]； };
这种行为很奇怪。您可以将
ng repeat
与
一起使用，否则
<script type="text/javascript"> var Option = function ($scope) { $scope.people = [ {name: "Choose a person", number: ""}, {name: "Tom", number: "0199"}, {name: "Justin", number: "0199"}, {name: "Jelly", number: "0199"}, ]; $scope.aa= $scope.people[0]; }; </script>