2017-05-22 2 views
0

Hier, warum bekomme ich Fehler als 'EmployeeCntrl' ist nicht registriert.Angular Routing-Fehler als 'EmployeeCntrl' ist nicht registriert

MyApp.js

/// <reference path="angular.js" /> 
/// <reference path="angular-route.js" /> 
    var app = angular.module('MyApp', ['ngRoute']) 
    app.controller('HomeCtrl', function ($scope) { 
     $scope.msg = "This is MyApp...."; 
    }) 

    app.config(function ($locationProvider, $routeProvider) { 

     $routeProvider 
     .when('/Employee', { 
      templateUrl: '/Html/Employee/Employee.html', 
      controller: 'EmployeeCntrl' 

     }) 
     .when('/Contact', { 
      controller:'ContactCtrl', 
      templateUrl: '/Html/Contact/Employee.js' 
     }) 
    }) 

Maserpage.html

<!DOCTYPE html> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head > 
    <title></title> 
    <script src="../../Script/angular.js"></script> 
    <script src="../../Script/angular-route.js"></script> 
    <script src="../../Script/MyApp.js"></script> 
    <link href="../CSS/Master.css" rel="stylesheet" /> 
</head> 
<body ng-app="MyApp" ng-controller='HomeCtrl'> 
    <!--// {{msg}}--> 

    <div id="RightDiv" class=""> 
     <a href="#!/Employee">Employee</a><br /> 
     <a href="#!/Contact">Contact</a> 
    </div> 
    <div> 
     <ng-view></ng-view> 
    </div> 
</body> 
</html> 

Dies ist mein Employee.js Code Hier implementiert i EmployeeCntrl, die aus MyApp.js Mitarbeiter steht vor der Tür. js

/// <reference path="F:\DesignPattern\WebApi\Client\Script/angular.js" /> 
/// <reference path="F:\DesignPattern\WebApi\Client\Script/angular-route.js" /> 
/// <reference path="F:\DesignPattern\WebApi\Client\Script/MyApp.js" /> 

app.controller('EmployeeCntrl', function ($scope) { 
    $scope.Emp="Hello Employee..." 
}) 

Hier implementiert I Employee.js-Code

Employee.html

<script src="Employee.js"></script> 
<div ng-controller="EmployeeCntrl"> 
    <p>This is Employee</p> 
    {{Emp}} 
</div> 
+2

Benötigt keine 'ng-contr oller = "EmployeeCntrl" in der Vorlage. entfernen Sie auch 'ng-controller =' HomeCtrl'' von 'Maserpage' –

+1

Sie müssen Employee.js in die index.html einbinden –

+0

EvenSame Fehler As EmployeeCntrl ist nicht Reg –

Antwort

1

Da Sie bereits den Controller für die Vorlagen in der Config definieren, notwendig sein nicht wieder in das zu erwähnen, Vorlage.

Auch ist es besser, Ihre notwendigen Controller-Dateien in der Masterpage selbst verweisen.

<link href="../CSS/Master.css" rel="stylesheet" /> 
    <script src="../../Script/angular.js"></script> 
    <script src="../../Script/angular-route.js"></script> 
    <script src="../../Script/MyApp.js"></script> 
    <script src="Employee.js"></script> 
+0

Aber Sajeethram Employee sollte in Anspruch kommen ... Auch wenn Ich habe Änderungen nach urs auch nicht funktioniert –

+0

sehen Sie einen Fehler in der Konsole? – Sajeetharan

+0

Fehler: [$ controller: ctrlreg] Der Controller mit dem Namen 'EmployeeCntrl' ist nicht registriert. –

1

Erste Employee.js-root html file hinzuzufügen.

Masterpage.html

<!DOCTYPE html> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head > 
    <title></title> 
    <script src="../../Script/angular.js"></script> 
    <script src="../../Script/angular-route.js"></script> 
    <script src="../../Script/MyApp.js"></script> 
    <script src="../../Script/Employee.js"></script> 
    <link href="../CSS/Master.css" rel="stylesheet" /> 
</head> 
<body ng-app="MyApp" ng-controller='HomeCtrl'> 
    <!--// {{msg}}--> 

    <div id="RightDiv" class=""> 
     <a href="#!/Employee">Employee</a><br /> 
     <a href="#!/Contact">Contact</a> 
    </div> 
    <div> 
     <ng-view></ng-view> 
    </div> 
</body> 
</html> 

Zweitens, da Sie Controller Referenz Weg genommen haben, keine Notwendigkeit, separat in html zu nehmen,

Employee.html

<div> 
    <p>This is Employee</p> 
    {{Emp}} 
</div> 
+0

stellen Sie sicher, Ihre ' Employee.js 'lädt nach' MyApp.js' – Sravan

Verwandte Themen