Выход для нг-приложения

0

Почему вывод для второго тега div отображается нормально? Почему нет привязки угловых js к нему?

Не могли бы вы объяснить мне?

<!DOCTYPE html>
<html>
<head>
    <title>Angular JS Demo</title>
    <script src="/angular.min.js"></script> 
    <script src="/Script.js"></script>
    <meta charset="utf-8" />
</head>
<body>

    <div ng-app="myApp1" ng-controller="myCtrl">
        {{ first_name +" "+ last_name }}
    </div>

    <div ng-app>
        10 +20 = {{ 10 + 20 }}
        {{ 1 == 2 }}
        {{ ['ajay','kumar','hari','bag'][0] }}
    </div>
    <script>
        var my_module = angular.module("myApp1", []);
        var my_Controller = function ($scope) {
            $scope.first_name = "vijay";
            $scope.last_name = "kumar";
        }
        my_module.controller("myCtrl", my_Controller);
    </script>
</body>
</html>

-----------выход------

vijay kumar

10 +20 = {{ 10 + 20 }} {{ 1 == 2 }} {{ ['ajay','kumar','hari','bag'][0] }}

3 ответа

0

Из документации AngularJS -

только одно приложение AngularJS может автоматически загружаться в HTML-документ.

Другими словами, директива ng-app может использоваться только один раз во всем приложении. S

В вашем случае ng-приложение ограничено только одним тегом div. Вне этого тега div функции angularjs не будут доступны. вы можете иметь родительский div с директивой ng-app, за которым следуют текущие div. Или просто, но директива в теге тела.

<!DOCTYPE html>
<html>
<head>
    <title>Angular JS Demo</title>
    <script src="/angular.min.js"></script>
    <script src="/Script.js"></script>
    <meta charset="utf-8" />
</head>
<body>

    <div ng-app="myApp1"> <!-- parent div -->
        <div ng-controller="myCtrl">
            {{ first_name +" "+ last_name }}
        </div>

        <div ng-app>
            10 +20 = {{ 10 + 20 }}
            {{ 1 == 2 }}
            {{ ['ajay','kumar','hari','bag'][0] }}
        </div>
    </div>
    <script>
        var my_module = angular.module("myApp1", []);
        var my_Controller = function ($scope) {
            $scope.first_name = "vijay";
            $scope.last_name = "kumar";
        }
        my_module.controller("myCtrl", my_Controller);
    </script>
</body>
</html>
0

Как указано в документах AngularJS, только одно приложение AngularJS может автоматически загружаться в HTML-документ. Первое ng-приложение, найденное в документе, будет использоваться для определения корневого элемента для автоматической загрузки в качестве приложения. Если вы хотите использовать другое ng-приложение, вы должны вручную загрузить приложение.

Подробное объяснение см. В разделе документации angularJS. https://docs.angularjs.org/api/ng/directive/ngApp

0

Попробуй вот так.

var app = angular.module('myApp1', []);

app.controller('myCtrl', function($scope) {
 $scope.first_name = "vijay";
  $scope.last_name = "kumar";
});
<script src="/angular.min.js"></script>


  <body >
   <div ng-app="myApp1" ng-controller="myCtrl">
        {{ first_name +" "+ last_name }}
        <div>
        10 +20 = {{ 10 + 20 }}
        {{ 1 == 2 }}
        {{ ['ajay','kumar','hari','bag'][0] }}
    </div>
    </div>

    
  </body>

Ещё вопросы

Сообщество Overcoder
Наверх
Меню