私の$ scopeがコントローラでアクセスできないのはなぜですか？Angular JS？

コントローラで宣言されたスコープ変数を取得できません。代わりに、私は以下reference error : message is not defined

を取得しています私のコードです：

マイIndex.htmlと

<body ng-app="myApp" ng-controller="homingController" ng-cloak> 
<script type="text/javascript"> 
    angular.module('myApp' ['ngRoute','ngMaterial']).controller('homingController', ['$scope', 

    function($scope){ 
     $scope.message = 'Hello'; 
    } 
    ]).config(function ($routeProvider) { 
    $routeProvider.when("/home", { 
     templateUrl: "home.html", 
     controller: "homingController" 
    }).when("/monitor", { 
     templateUrl: "monitor.html", 
     controller: "monitoringController" 
    }).otherwise({ 
     redirectTo: '/home' 
    }); 
}).controller('monitoringController', function ($scope) { 
    $scope.message = "Monitor"; 
}); 
</script> 

<nav class = "navbar navbar-inverse" role="navigation"> 
    <ul class = "nav navbar-nav" > 
     <li ><a href="#!/home" class = "active" ui-sref= "home" style="margin: 0px 1px 0px 19px"><img src="./images/home.svg">Home</a></li> 
     <li ><a href="#!/monitor" class = "active" ui-sref = "monitor" ><img src="./images/monitor.svg">Monitor</a></li> 
     <li ><a class = "active" ui-sref = "Audit" ><img src="./images/audit.svg">Audit</a></li> 
     <li ><a class = "active" ui-sref = "configuration" ><img src="./images/configure.svg">Configure</a></li> 
    </ul> 
</nav> 
</div> 
</body> 
<div ng-view></div>

マイhome.html

{{ message}} 
/*This line giving error in console : angular.js:14328 ReferenceError: $scope is not defined 
*/

は、私がここで行方不明です何がありますか？

出典

2017-10-23 CodeWithCoffee

はい...問題を再現する[mcve]がありません – charlietfl

何を追加する必要がありますか？ – CodeWithCoffee

あなたの 'angular.js'スクリプトはどこにありますか –

<div ng-view></div>は、<body>タグの内側にある必要があります。あなたのアプリを定義する本体の外側に配置することによって、ビューはどのアプリケーションやコントローラを使用すべきか分かりません。

また、あなたはあなたのrouteconfigでそれらを定義するので、どこでもあなたの意見を中心に ng-controller年代を特定する必要はありません

：あなたは、コントローラのいずれかから何かを表示したい場合は

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

app.config(function($routeProvider) { 
    $routeProvider 
    .when("/home", { 
     templateUrl: "home.html", 
     controller: "homingController" 
    }).when("/monitor", { 
     templateUrl: "monitor.html", 
     controller: "monitoringController" 
    }).otherwise({ 
     redirectTo: '/home' 
    }); 
}); 

app.controller('homingController', function($scope) { 
    $scope.message = 'Hello'; 
}) 

app.controller('monitoringController', function($scope) { 
    $scope.message = "Monitor"; 
});

あなたがそれを定義する必要があります{{ message }}を含むあなたのhome.html & monitor.htmlで

<!DOCTYPE html> 
<html> 

<head> 
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script> 
</head> 

<body ng-app="myApp"> 

    <div ng-controller="homingController"> 
    {{message}} 
    </div> 

    <nav class="navbar navbar-inverse" role="navigation"> 
    <ul class="nav navbar-nav"> 
     <li> 
     <a href="#!/home">Home</a> 
     </li> 
     <li> 
     <a href="#!/monitor">Monitor</a> 
     </li> 
    </ul> 
    </nav> 

    <div ng-view></div> 

</body>

：そうのような。これの正確な例は、w3Schools（「コントローラー」という見出しの下にあります）にあります。それを構築したら、アプリケーションの残りの部分を埋めるために作業を開始してください。

出典

2017-10-23 22:02:55 Patrick

私の$ scopeがコントローラでアクセスできないのはなぜですか？Angular JS？

答えて

関連する問題