Question

今天是我开始阅读有关Angular JS的第一篇文章，我在阅读完教程后尝试做了一件非常基本的事情。

    <!DOCTYPE html>
<html data-ng-app="">
<head>
    <title></title>    
</head>
<body>
Name:
<br />
<input type="text" data-ng-app="name" /> {{ name }}

<script src="Scripts/angular.min.js" type="text/javascript"></script>
</body>
</html>

我从GitHUB 1.4.x（最新版）下载并添加了角度js库。我希望当用户在文本框中输入但没有任何反应时，该名称将被动态写入。我对这个基本设置缺少什么？

P.S。 - 我在Visual Studio 2010中使用HTML页面。

Answer 1

我注意到了一些事情。

a）不引用应包含角度模块声明的脚本文件。 b）输入引用一个名为＆＃34; name＆＃34;但它会立即关闭 c）没有声明控制器 d）data-ng-app需要较旧版本的角度。我建议使用1.3.5

我将进行以下更正以使其正常工作。

http://plnkr.co/edit/rfXgNl6ugqSmlwXOaHIN?p=preview

<!DOCTYPE html>
<html >

<head>
  <title>
    My First Angular App
  </title>
  <script src="https://code.angularjs.org/1.3.15/angular.js" type="text/javascript"></script>
  <script type="text/javascript">
    var app = angular.module('name', []);
    app.controller('MainCtrl', function($scope) {
      $scope.name = 'World';
    });
  </script>
</head>

<body ng-app="name">
  Name:
  <br />
  <div ng-controller="MainCtrl">
    <input type="text" ng-model="name"/>
    {{name}}
  </div>

</body>

</html>

Answer 2

JSFIDDLE http://jsfiddle.net/seadonk/aze39fjq/

将html标记更改为：<html ng-app>

将您的输入指令更改为data-ng-model="name"

<html ng-app>
    <head>
    </head>
<body>
    Name:
    <br />
    <input type="text" data-ng-model="name" /> {{ name }} 
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js"></script>
</body>
</html>

Answer 3

对您的代码进行一些小的调整，它的工作正常：

<html ng-app="">
        <head>
            <title></title>    
        </head>
        <body>
        Name:
        <br />
        <input type="text" ng-model="name" /> {{ name }}

        <script src="Scripts/angular.min.js" type="text/javascript"></script>
</body>
</html>

可在此处查看工作代码笔：http://codepen.io/anon/pen/jPWyaR

Angular JS指令ng-app无法识别

3 个答案: