Именованный контроллер не выполняется в AngularJS

Привет, ребята, я сейчас изучаю основы angular js, и у меня есть фрагмент кода, как показано ниже:

<div data-ng-app="">
    First Name: <input type="text" data-ng-model="fName" ><br />
    Last Name: <input type="text" data-ng-model="lName" ><br /><br />
    Full Name: {{fName + " " + lName}}
</div>

<script>

    var app = angular.module('app1', []);       
    app.controller('ctrl', function($scope){
        $scope.fName = "John";
        $scope.lName = "McKenzie";
    });

</script>

Проблема в том, что когда я называю приложение следующим образом «data-ng-app = 'app1'», фрагмент кода перестает выполняться, а выходным данным присваивается полное имя: {{fName + "" + lName}}. Это также происходит, когда я пытаюсь определить контроллер.

Без определения контроллера и имени приложения код выполняется нормально. Может ли кто-нибудь объяснить, что я, возможно, делаю неправильно. Спасибо


angularjs single-page-application
person Tatenda    schedule 17.05.2015    source источник
comment
Вам нужно определить, какой контроллер вы хотите использовать, используя ng-controller: <div data-ng-app="app1" data-ng-controller="ctrl">...   -  person Numyx    schedule 17.05.2015
comment
Это также происходит, когда я пытаюсь определить контроллер, вы должны показать нам, как вы определяете контроллер, потому что в этом проблема.   -  person Shomz    schedule 17.05.2015
comment
@Numyx - это то, что я сделал, но когда я определяю контроллер, выражение не выполняется, а также, когда я определяю контроллер так же, как вы это сделали, оно не выполняется. Выражение работает только тогда, когда я ничего не определяю, как показано в моем фрагменте кода.   -  person Tatenda    schedule 17.05.2015

Ответы (1)


arrow_upward
0
arrow_downward

Я просто попробовал это, и все работает нормально.

HTML

   <!DOCTYPE html>
<html data-ng-app="app1">

  <head>
    <link rel="stylesheet" href="style.css">

    <script src="//cdnjs.cloudflare.com/ajax/libs/angular.js/1.3.15/angular.min.js"></script>
  <script src="script.js"></script>
  </head>

  <body>
   <div ng-controller="ctrl">
    First Name: <input type="text" data-ng-model="fName" ><br />
    Last Name: <input type="text" data-ng-model="lName" ><br /><br />
    Full Name: {{fName + " " + lName}}
</div>
  </body>

</html>

JS

var app = angular.module('app1', []);       
    app.controller('ctrl', function($scope){
        $scope.fName = "John";
        $scope.lName = "McKenzie";
    });
person Wahid Kadwaikar    schedule 17.05.2015