Question

我是Angular JS的新手，当我尝试使用JSON变量获取和打印一些$scope数据时，但是双花括号只是不起作用，因为我认为它会做。

HTML：

<!doctype html>
<html lang="en" ng-app="myApp">

<head>
    <meta charset="utf-08">
    <meta name="author" content="YYQ">
    <meta name="description" content="YYQAngularJS">
    <title>YYQAngularJS</title>
    <script src="Script/angular.js" type="javascript"></script>
</head>

<body ng-controller="myController">
<div> haha {{ p.name }} </div>

<script src="Script/jquery-3.1.1.js" type="javascript"></script>
<script src="Script/index.js" type="javascript"></script>
</body>

</html>

JS：

$(window).on("load",function () {

    var $myApp = angular.module('myApp',[]);

    $myApp.controller('myController',function ($scope) {
        $scope.p =
            {
                "name":"a",
                "id":"1"
            }
    });

});

结果：

哈哈{{p.name}}

更新

HTML文件：

<!doctype html>
    <html lang="en" ng-app="myApp">

    <head>
        <meta charset="utf-08">
        <meta name="author" content="YYQ">
        <meta name="description" content="YYQAngularJS">
        <title>YYQAngularJS</title>
        <script src="Script/angular.js" type="javascript"></script>
    </head>

    <body ng-controller="myController">
    <div> haha {{ p.name }} </div>

    <script src="Script/jquery-3.1.1.js" type="javascript"></script>
    <script src="Script/index.js" type="javascript"></script>
    </body>

    </html>

JS档案：

var $myApp = angular.module('myApp',[]);

        $myApp.controller('myController',function ($scope) {
            $scope.p =
                {
                    "name":"a",
                    "id":"1"
                }
        });

现在我收到了这个错误：

未捕获错误：[$ injector：modulerr]由于以下原因无法实例化模块myApp：错误：[$ injector：nomod]模块'myApp'不可用！您要么错误拼写了模块名称，要么忘记加载它。如果注册模块，请确保将依赖项指定为第二个参数。

Answer 1

删除$(window).on("load",function () {
将所有type="javascript"代码

type="text/javascript"

<script></script>

Angularjs将在加载DOM之前加载它

这是工作代码

＆＃13;

<!DOCTYPE html>
<html lang="en" ng-app="myApp">

<head>
  <meta charset="utf-08" />
  <meta name="author" content="YYQ" />
  <meta name="description" content="YYQAngularJS" />
  <title>YYQAngularJS</title>
  <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.6/angular.min.js"></script>
</head>

<body ng-controller="myController">
  <div> haha {{ p.name }} </div>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
  <script>

      var $myApp = angular.module('myApp', []);

      $myApp.controller('myController', function($scope) {
        $scope.p = {
          "name": "a",
          "id": "1"
        }
      });

  </script>
</body>

</html>

＆＃13;

Answer 2

$(window).on('load', () => {})与您的角度应用程序发生冲突。

＆＃13;

var $myApp = angular.module('myApp', []);

$myApp.controller('myController', function($scope){
  $scope.p = {
    "id": 1,
    "name": "Angular App working"
  };
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<!doctype html>
<html lang="en" ng-app="myApp">

<head>
    <meta charset="utf-08">
    <meta name="author" content="YYQ">
    <meta name="description" content="YYQAngularJS">
    <title>YYQAngularJS</title>
    <script src="Script/angular.js" type="javascript"></script>
</head>

<body ng-controller="myController">
<div> haha {{ p.name }} </div>

<script src="Script/jquery-3.1.1.js" type="javascript"></script>
<script src="Script/index.js" type="javascript"></script>
</body>

</html>

＆＃13;

angularjs双花括号不起作用

2 个答案: