AngularJSコントローラがアクセスされていません

AngularJSを学習していますが、コントローラに問題があります。AngularJSコントローラがアクセスされていません

この例は既に機能していますが、突然変更が行われずに停止しました。何が間違っているのか分かりません。

/templates/index.htmlファイルが読み込まれません。

これが私のメインのindex.htmlです：

<!DOCTYPE html> 
<html lang="en"> 
<head> 
    <meta charset="UTF-8"> 
    <title>Todolist</title> 
    <!-- Latest compiled and minified CSS --> 
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"> 
    <!-- Optional theme --> 
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp" crossorigin="anonymous"> 
    <!-- ANGULAR JS --> 
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script> 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-router/1.0.3/angular-ui-router.min.js"></script> 
    <script src="app/app.js"></script> 
    <script src="app/controllers/todolists.js"></script> 

</head> 
<body ng-app="app"> 

<div ui-view></div> 

</body> 
</html>

これは私のapp.jsです：

var app = angular.module('app'); 
var controllers = {}; 

console.log("test"); 

controllers.todolists = function ($scope, $http) { 

    console.log("test1"); 

    $http.get('http://localhost:8888/todolist/rest/entries/index.json'). 
     then(function(response) { 

      console.log(response.data); 
      $scope.data = response.data; 
     }); 
}; 

app.controller(controllers);

はconsole.log（：

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

    app.config(function ($stateProvider) { 

    $stateProvider 
     .state('/', { 
      url: "/", 
      templateUrl: "app/templates/index.html", 
      controller: 'todolists', 
     }); 
});

これは私のtodolistsコントローラであります"test"）はコンソールに書き込みますが、console.log（ "test1"）はそうしないので、コントローラにはアクセスしません。

何が間違っているのかをよく知っていれば教えてください。

ありがとう、グレガ

出典

2017-07-12 Gregor Koprivnikar

ですか？あなたはそれをどこで見ましたか？ –

コントローラーがオブジェクトとして定義されているのはなぜですか？ – Tik

しばらくの間、anguraljsで作業していた友人は、そのようなコントローラをすべて定義しているので、オブジェクトのように定義するのは問題ありません。それは以前にも働いていたので、私は問題ではありません。しかし、私は定義を変更する必要がある場合は、どうか書きなさい。ありがとう –

コントローラの名前を登録する必要があります。 Iveはコントローラ登録メソッドに必要な最初の引数である 'todolistCtrl'という名前を登録しました。 2番目の引数はcontrollers.todolists関数です。

あなたはState Provider内でdolistCtrlを参照できます。このコントローラdefinationは有効な

コントローラ

var controllers = {}; 

console.log("test"); 

controllers.todolists = function ($scope, $http) { 

$http.get('http://localhost:8888/todolist/rest/entries/index.json'). 
     then(function(response) { 

      console.log(response.data); 
      $scope.data = response.data; 
     }); 

}; 

angular.module('app') 
.controller('todolistCtrl', controllers.todolists);

アプリ

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

    app.config(function ($stateProvider, $urlRouterProvider) { 
    $urlRouterProvider.otherwise('/'); 

    $stateProvider 
     .state('/', { 
      url: "/", 
      templateUrl: "index.html", 
      controller: 'todolistCtrl', 
     }); 
});

Plunker Example

出典

2017-07-12 14:08:48 Tik

ありがとう、それは動作します！ :) –

よく聞いて答えを受け入れるようにしてください – Tik

AngularJSコントローラがアクセスされていません

答えて

関連する問題