Front-end - ng-view tidak boleh dimuatkan ke dalam templat
PHP中文网
PHP中文网 2017-05-15 16:57:16
0
2
570

Semasa mempelajari tutorial angularjs, ng-view tidak dimuatkan ke dalam templat
Tetapi ia boleh dimuatkan ke dalam templat mengikut kaedah penulisan rasmi, tetapi kaedah penulisan saya sendiri tidak berfungsi!
Apakah perbezaan antara kaedah penulisan saya dan kaedah rasmi Mengapakah ia tidak boleh dimuatkan ke dalam templat?
Berikut ialah struktur direktori projek saya

Cara penulisan saya

app.js

'use strict';

/* App Module */
angular.module('phonecatApp',['ngRoute'])
.config(['$routeProvider',function($routeProvider) {
  $routeProvider
  .when('/phones',{
    templateUrl:'partials/phone-list.html',controller:'PhoneListCtrl'})
  .when('/phones/:phoneId', {
    templateUrl:'partials/phone-detail.html',controller:'PhoneDetailCtrl'})
  .otherwise({redirectTo: '/phones'});
}]);

pengawal.js

angular.module('phonecatApp',[])
.controller('PhoneListCtrl',['$scope','$http', function($scope, $http) {
    $http.get('phones/phones.json')
    .success(function(data) {
        $scope.phones = data.splice(0,5);
    });

    $scope.orderProp = 'age';

}])
.controller('PhoneDetailCtrl',['$scope','$routeParams',function($scope,$routeParams) {
    $scope.phoneId = $routeParams.phoneId;
}]);

Cara menulis dalam tutorial rasmi

app.js

var phonecatApp = angular.module('phonecatApp', [
  'ngRoute',
  'phonecatControllers'
]);

phonecatApp.config(['$routeProvider',
 function($routeProvider) {
    $routeProvider.
      when('/phones', {
        templateUrl: 'partials/phone-list.html',
        controller: 'PhoneListCtrl'
      }).
      when('/phones/:phoneId', {
        templateUrl: 'partials/phone-detail.html',
        controller: 'PhoneDetailCtrl'
      }).
      otherwise({
        redirectTo: '/phones'
      });
  }]);

pengawal.js

var phonecatControllers = angular.module('phonecatControllers', []);
phonecatControllers.controller('PhoneListCtrl', ['$scope', '$http',
  function($scope, $http) {
    $http.get('phones/phones.json').success(function(data) {
      $scope.phones = data;
    });
   $scope.orderProp = 'age';
 }]);
phonecatControllers.controller('PhoneDetailCtrl', ['$scope', '$routeParams',
  function($scope, $routeParams) {
    $scope.phoneId = $routeParams.phoneId;
 }]);
PHP中文网
PHP中文网

认证0级讲师

membalas semua(2)
小葫芦

angular.module('phonecatApp',[]) Apabila menggunakan modul sedia ada, jangan tambah kebergantungan berikutnya. . .
angular.module('phonecatApp'). . . Itu ok!
Anda mentakrifkan semula modul bernama phonecatApp sama seperti di atas, dan kebergantungan kosong [].

Peter_Zhu

Modul telah ditakrifkan semula, tukar nama dalam pengawal dan apl bergantung padanya

Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan