AngularJS :: Не работает

-5

См. Ниже код. Я не могу понять, почему это не работает.AngularJS :: Не работает

Заранее спасибо.

<html> 
<head> 
    <title></title> 

</head> 
<body ng-app="myapp" ng-controller="studentController" ng-init="countries=[{name:'India',language:'Hindi'},{name:'United States',language:'English'}]"> 

    <div> 

     Enter first name: <input type="text" ng-model="student.firstname"> 
     Student Name {{student.fullname()}}!! 
    </div> 

    <script> 
     function studentController($scope) { 
      $scope.student = { 
       firstname: "Fname", 
       lastname: "Lname", 
       fullname: function() { 
        var studObj; 
        studObj = $scope.student; 
        return studObj.firstname + ' ' + studObj.lastname; 
       } 
      }; 

     } 
    </script> 
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.0-beta.17/angular.min.js"></script> 
</body> 
</html>

Выражение {{student.fullname()}} происходит так же, как в браузере.

Спасибо вам всем !! Однако см. Очень похожий код ниже - который работает. Я изо всех сил пытаюсь понять ситуацию.

<html> 
<head> 
    <title></title> 

</head> 
<body ng-app="myapp" ng-controller="studentController" ng-init="countries=[{name:'India',language:'Hindi'},{name:'United States',language:'English'}]"> 

    <div> 

     Enter first name: <input type="text" ng-model="student.firstname"> 
     Student Name {{student.fullname()}}!! 
    </div> 

    <script> 
     function studentController($scope) { 
      $scope.student = { 
       firstname: "Fname", 
       lastname: "Lname", 
       fullname: function() { 
        var studObj; 
        studObj = $scope.student; 
        return studObj.firstname + ' ' + studObj.lastname; 
       } 
      }; 

     } 
    </script> 
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.0-beta.17/angular.min.js"></script> 
</body> 
</html>

источник

2015-06-11 TechTurtle

Пожалуйста, следуйте любому не-устаревшему учебнику, чтобы увидеть, что простое Угловое приложение должно выглядеть как. –

Вам нужно создать свой myapp первым, прежде чем использовать его. Кроме того, ваш угловой код должен появиться после загрузки файла angularjs.

<html> 
<head> 
    <title></title> 

</head> 
<body ng-app="myapp" ng-controller="studentController" ng-init="countries=[{name:'India',language:'Hindi'},{name:'United States',language:'English'}]"> 

    <div> 

     Enter first name: <input type="text" ng-model="student.firstname"> 
     Student Name {{student.fullname()}}!! 
    </div> 


    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.0-beta.17/angular.min.js"></script> 
    <script> 
     var app = angular.module("myapp", []); 
     app.controller("studentController", function ($scope) { 
      $scope.student = { 
       firstname: "Fname", 
       lastname: "Lname", 
       fullname: function() { 
        var studObj; 
        studObj = $scope.student; 
        return studObj.firstname + ' ' + studObj.lastname; 
       } 
      }; 

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

источник

2015-06-11 13:24:43

Две вещи.

Вам необходимо ввести Угловое перед вашим кодом приложения.
Вам необходимо зарегистрировать контроллер с контейнером IoC.

Я сделал одно изменение ради стиля, studentController стал StudentController. Это связано с тем, что контроллеры в Angular являются новыми классами или конструкторскими функциями. Функции Idiomatic JavaScript contsructor должны быть PascalCase.

<html> 
 
<head> 
 
    <title></title> 
 

 
</head> 
 
<body ng-app="myapp" ng-controller="StudentController" ng-init="countries=[{name:'India',language:'Hindi'},{name:'United States',language:'English'}]"> 
 

 
    <div> 
 

 
     Enter first name: <input type="text" ng-model="student.firstname"> 
 
     Student Name {{student.fullname()}}!! 
 
    </div> 
 
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.0-beta.17/angular.min.js"></script> 
 
    <script> 
 
     StudentController.$inject = ['$scope']; 
 
     function StudentController($scope) { 
 
      $scope.student = { 
 
       firstname: "Fname", 
 
       lastname: "Lname", 
 
       fullname: function() { 
 
        var studObj; 
 
        studObj = $scope.student; 
 
        return studObj.firstname + ' ' + studObj.lastname; 
 
       } 
 
      }; 
 
     } 
 
     
 
     angular.module('myapp', []).controller('StudentController', StudentController); 
 
    </script> 
 
</body> 
 
</html>

источник

2015-06-11 13:19:20 Martin

Измените файл сценарий, а также удалить MyApp с нг-приложения, используйте код таким образом: -

<html > 
<head> 
    <title></title> 
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.min.js"></script> 
</head> 
<body ng-app="" ng-controller="studentController" ng-init="countries=[{name:'India',language:'Hindi'},{name:'United States',language:'English'}]"> 

    <div> 

     Enter first name: <input type="text" ng-model="student.firstname"> 
     Student Name {{student.fullname()}}!! 
    </div> 

    <script> 
     function studentController($scope) { 
      $scope.student = { 
       firstname: "Fname", 
       lastname: "Lname", 
       fullname: function() { 
        var studObj; 
        studObj = $scope.student; 
        return studObj.firstname + ' ' + studObj.lastname; 
       } 
      }; 

     } 
    </script> 

</body> 
</html>

источник

2015-06-11 13:25:11

Я обновил вопрос, чтобы предоставить более подробную информацию. – TechTurtle

Извините @mahesh Это не сработало – TechTurtle

AngularJS :: Не работает

ответ

Смежные вопросы