Начало работы с проблемой AngularJS Plunk

0

Я новичок в Angular JS. Я пытаюсь начать с основной программы Hello World. Вот мой plunk http://plnkr.co/edit/uW1fHB7a17gpvn341sn3?p=preview.

var MainController = function($scope){
  $scope.message = "Hello, Angular!";
}
<html ng-app>

<head>
  <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.5/angular.min.js"></script>
  <link rel="stylesheet" href="style.css" />
  <script src="script.js"></script>
</head>

<body>
  <div ng-controller="MainController">
    <h1>{{message}}</h1>
  </div>
</body>

</html>

Я создал простой контроллер и имеет единственную привязку к модели. Это не работает для меня. Я не могу понять, в чем проблема. Может кто-нибудь, пожалуйста, помогите мне в начале.

  • 0
    Вы изменили план, так как ответы появились - план больше не отражает вопрос, когда вы его задавали :(
  • 0
    Я уже пометил правильный ответ, данный @scniro
Теги:
plunker

3 ответа

1
Лучший ответ

Вам необходимо правильно настроить ваше приложение и правильно определить контроллер. Соблюдайте следующие изменения...

<html ng-app="app">

angular.module('app', []).controller('MainController', MainController)

Plunker - обновленная демоверсия

Ресурсы AngularJS Getting Started должны быть заполнены всем, что вы хотели бы знать, чтобы встать и запустить

Поделиться
  • 0
    Спасибо за быстрое решение. Он отлично работал с AngularJS 1.2.1, однако он не работал с 1.4.5. Так это обновленный способ начать?
  • 0
    Плункер отлично работает с 1.4.5, вы это проверили? Какую ошибку вы получаете?
Показать ещё 3 комментария
0

Ваш оригинальный код отлично работает с Angular 1.0, просто не с 1.4. Просто подумал, что стоит упомянуть, если вы следите за учебником и задаетесь вопросом, почему он не работает или что-то в этом роде.

Смотрите, что plunkr работает отлично в 1.0 с эквивалентным кодом для вашего... http://plnkr.co/edit/zbWvwxVDvhhVKgc5lGrr?p=preview

<!doctype html>
<html ng-app>
  <head>
    <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.0.5/angular.min.js"></script>
    <script src="script.js"></script>
  </head>
  <body>
    <div ng-controller="MainController">
      {{message}}
    </div>
  </body>
</html>

а также

var MainController = function($scope) {
  $scope.message = "Hello, Angular!";
}
Поделиться
0

Пара вещей.

Вам нужно создать угловой модуль:

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

Второй аргумент - это массив модулей зависимостей. Вам здесь не нужен.

Затем измените ng-app на ng-app="myApp" ссылаясь на то, что вы назвали своим модулем.

Затем вам нужно создать контроллер с угловым способом.

app.controller('MainController',MainController);

Здесь полный сценарий. Plunkr

function MainController($scope) {
  $scope.message = 'Hello World';
}

var app = angular.module('myApp',[]);
app.controller('MainController',MainController);
Поделиться
  • 0
    двойной ответ
  • 1
    это похоже, хотя точно не скопировано с твоего :) И написано одновременно.
Показать ещё 1 комментарий

Ещё вопросы

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