Seite wird nicht aktualisiert in Angular

Ich erstelle eine Testprojekt-Website mit eckigen (Lernen) und NG-Ansicht wird nicht aktualisiert, wenn ich auf Test auf index.html Seite klicke. Ich habe die letzten 2 Stunden im Internet gesucht und verschiedene Lösungen ausprobiert und nichts hat funktioniert. Bitte helfen Sie bei dem was ich falsch mache !!!Seite wird nicht aktualisiert in Angular

index.html

<!DOCTYPE html> 
<html> 
<head> 
    <title></title> 
    <meta charset="utf-8" /> 
    <!-- Angular References --> 
    <script src="Scripts/angular.min.js"></script> 
    <script src="Scripts/jcs-auto-validate.min.js"></script> 
    <script src="Scripts/angular-route.min.js"></script> 
    <!-- Bootstrap Core CSS --> 
    <script src="Scripts/jquery-1.9.1.min.js"></script> 
    <script src="Scripts/bootstrap.min.js"></script> 
    <link href="Content/bootstrap.min.css" rel="stylesheet" /> 
    <link href="Content/font-awesome.min.css" rel="stylesheet" /> 
    <!-- CSLMS App Angular References --> 
    <script src="CSLMS_app/app.js"></script> 
    <script src="CSLMS_app/Recipe_Values/ConstantValues.js"></script> 
    <script src="CSLMS_app/Controllers/indexController.js"></script> 
    <!-- Style Sheets --> 
    <link href="Content/Site.css" rel="stylesheet" /> 
</head> 
<body ng-app="CSLMS_app"> 
    <div ng-controller="indexController"> 
     <!-- Top Navigation --> 
     <nav class="navbar navbar-dark bg-primary navbar-fixed-top" > 
      <div class="container-fluid"> 
       <!-- Brand and toggle get grouped for better mobile display --> 
       <div class="navbar-header"> 
        <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false"> 
         <span class="sr-only">Toggle navigation</span> 
         <span class="icon-bar"></span> 
         <span class="icon-bar"></span> 
         <span class="icon-bar"></span> 
        </button> 
        <a class="navbar-brand" href="#">CS-LMS</a> 
       </div> <!-- /.navbar-header --> 
       <!-- Collect the nav links, forms, and other content for toggling --> 
       <div class="navbar-collapse collapse" id="bs-example-navbar-collapse-1"> 
        <ul class="nav navbar-nav"> 
         <li><a class="navbar-brand" href="#">Dashboard</a></li> 
         <li><a class="navbar-brand" href="#/Test">Test</a></li> 
        </ul> 
        <ul class="nav navbar-nav navbar-right"> 
         <li class="dropdown"> 
          <a href="javascript:;" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">{{user.username}}<span class="caret"></span></a> 
          <ul class="dropdown-menu"> 
           <li><a href="javascript:;">Links</a></li> 
           <li><a href="javascript:;">Edit Profile</a></li> 
           <li role="separator" class="divider"></li> 
           <li><a href="javascript:;">Logout</a></li> 
          </ul> 
         </li> 
        </ul> 
       </div><!-- /.navbar-collapse --> 
      </div><!-- /.container-fluid --> 
     </nav> 

     <div ng-view></div> 

    </div> 
</body> 
</html>

Test.html

<div ng-controller="TestController"> 
    <h1>test Pagerr</h1> 
    <br /> 
    {{message}} 

    <script src="../CSLMS_app/Controllers/testController.js"></script> 
</div>

app.js

'use strict'; 

//var app = angular.module('CSLMS_app', ['jcs-autoValidate', 'ngRoute']); 
var app= angular.module('CSLMS_app', ['jcs-autoValidate', 'ngRoute']); 


app.config(['$routeProvider', function ($routeProvider) { 
    $routeProvider 
    .when("/Login", { 
     templateUrl: "Pages/Login.html", 
     controller: "loginController" 
    }) 
    .when("/Test", { 
     templateUrl: "Pages/Test.html", 
     controller: "testController" 
    }) 
    .otherwise({ redirectTo: '/Test' }) 
}]);

testController.js

indexController.js

'use strict'; 
app.controller('indexController', ['$scope', function ($scope) { 
    $scope.somedata = "That"; 
}]);

Quelle

2017-01-25 mspelly

Haben Sie einen Fehler in der Konsole? – Mistalis

Sie können $ location.replace ('/ test') verwenden –

Bitte überprüfen Sie, ob Sie einen Fehler in der Konsole haben, aber haben Sie versucht, die Skriptquelle aus Test.html zu entfernen und in die Seite index.html zu legen? – LookForAngular

Nur eine Vermutung hier, aber Sie könnten dies verschieben möchten:

<script src="../CSLMS_app/Controllers/testController.js"></script>

aus Test.html und in das <head> Element index.html . Ich vermute, das ist ein Problem. Vielleicht gibt es mehr, aber ich würde es zumindest tun.

Quelle

2017-01-25 14:34:04

Hat das und keinen Unterschied – mspelly

Sie haben vergessen, Ihr Skript für testController zu laden. Fügen Sie diese Zeile zu Ihrer index.html:

<script src="CSLMS_app/Controllers/testController.js"></script>

Quelle

2017-01-25 14:38:56 Mistalis

Hi Mistalis - Das obige Skript wurde in meine Test.html-Datei geladen, aber es von dort entfernt und in die Datei index.html verschoben. Immer noch keinen Unterschied und keinen Fehler in der Konsole. Irgendwelche Ideen!!! – mspelly

Wäre das ein Problem - ich verwende VS2015 und IIS Express. Ich lese die ng-route benötigt einen Webserver -? – mspelly

Seite wird nicht aktualisiert in Angular

Antwort

Verwandte Themen