Mein AngularJS Routing funktioniert nicht?

Ich habe meine Hauptseite, von der ich routing tun möchte, aber wenn ich diese Seite beginne, sehe ich nichts und im Browser gibt es kein #/sing hier, ich bin stecken geblieben, ich bin ein Anfänger, also würde ich jeden schätzen helfen, dies ist mein Code aus dem Haupt Seite:Mein AngularJS Routing funktioniert nicht?

<div class="container"> 
    <input type="text" ng-model="search.tel" /> 
    <ul> 
     <li data-ng-repeat="con in contacts|filter:search.tel|orderBy:'name':true" ng-cloak>{{con.name}}-{{con.tel}}</li> 
    </ul> 
    <div class="row"> 
     <div class="col-md-8"> 
      <p ng-class="{'text-center':center,'text-danger':error}" ng-style="styleDemo()"> 
       {{725508723000|date:"h 'o''clock'"}} 
      </p> 
      <input type="checkbox" ng-model="center"/> 
      <input type="checkbox" ng-model="error" /> 
      <label><input type="checkbox" ng-model="styler"/>ng-style</label> 
      <p>{{'Lorem ipsum dolar sit amet'|truncate:15}}</p> 
     </div> 
    </div> 

</div> 
<a href="#/add">Add page</a>

Und mein Add-Seite:

<div class="container"> 
    <div class="jumbotron"> 
     <h1>This is my add page</h1> 
    </div> 
    Customer Name:<br /> 
    <input type="text" data-ng-model="newCustomer.name"/><br /><br /> 
    Customer City:<br /> 
    <input type="text" data-ng-model="newCustomer.code"/><br /><br /> 
    <button data-ng-click="addCustomer()">Add customer</button><br /><br /><br /> 
    Filter:<br /> 
    <input type="text" data-ng-model="customer.name" /><br /> 
    <ul> 
     <li data-ng-repeat="customer in customers|filter:customer.name">{{customer.name}}-{{customer.code}}</li> 
    </ul> 
</div>

ich habe Konsole diesen Fehler, aber ich

<!DOCTYPE html> 
<html data-ng-app="myApp"> 
<head> 
    <title></title> 
    <meta charset="utf-8" /> 
    <link href="Content/bootstrap.min.css" rel="stylesheet" /> 
    <script src="Scripts/bootstrap.min.js"></script> 
    <script src="Scripts/angular.min.js"></script> 
</head> 
<body> 
    <div> 
     <div data-ng-view=""></div> 
    </div> 

    <script> 
     var myApp = angular.module("myApp", []).controller("SimpleController", ['$scope', function ($scope) { 

      $scope.contacts = [ 
       { name: "Jhony", tel: "0338987121" }, 
       { name: "JhonyK", tel: "03332443545" }, 
       { name: "JhonyKun", tel: "03385666767" }, 
       { name: "Nick", tel: "12232434343" }, 

      ]; 

      $scope.styleDemo = function() { 
       if (!$scope.styler) { 
        return; 
       } 

       return { 
        background: "red", 
        fontWeight: "bold", 
       }; 
      } 
     }]).filter('truncate', function() { 
      return function (input, limit) { 
       return (input.length > limit) ? input.substr(0, limit) + '...' : input; 
      }; 
     }).controller("addController", ['$scope', function ($scope) { 

      $scope.customers = [ 
       { name: "Jhony", code: "12323232" }, 
       { name: "JhonyK", code: "133443453" }, 
       { name: "JhonyKun", code: "165768787" }, 
       { name: "Nick", code: "14323232434" }, 
       { name: "NickK", code: "1897872323" }, 
       { name: "NickKun", code: "156656523323" }, 
      ] 

      $scope.addCustomer = function() { 
       $scope.customers.push({ name: $scope.newCustomer.name, code: $scope.newCustomer.code }); 
      } 
     }]); 

     myApp.config(function ($routeProvider) { 
      $routeProvider.when('/', 
        { 
         controller: "SimpleController", 
         templateUrl: "HtmlPage2.html" 
        }) 
      .when('/add', 
      { 
       controller: 'addController', 
       templateUrl: 'add.html' 
      }) 
      .otherwise(
      { 
       redirectTo: '/' 
      }); 
     }); 
    </script> 
</body> 
</html>

Hier meine Seite HtmlPage2.html ist ich nsert jQuery und immer noch nichts:

Error: Bootstrap's JavaScript requires jQuery
angular.min.js:40Error: [$injector:modulerr] http://errors.angularjs.org/1.5.8/ $injector/modulerr?p0=myApp&p1=%5B%24injector%3Aunpr%5D%20http%3A%2F%2Ferrors.angularjs.org%2F1.5.8%2F%24injector%2Funpr%3Fp0%3D%2524routeProvider

Quelle

2016-08-08 jhony3

Haben Sie einen Fehler in der Konsole gesehen ?? – Keshav

Ich habe vergessen, ich muss thx für den Rat sehen – jhony3

Haben Sie unbeeinträchtigte eckige Skript? wie: ''. Wenn Sie dies tun, ändern Sie es und zeigen Sie den neuen Konsolenfehler an, den Sie erhalten. Haben Sie das jQuery-Skript vor dem eckigen eingefügt? – AranS

Sie müssen umfassen Winkel route.min.js-Datei können Sie HTML und fügen ngRoute als Abhängigkeit zu Ihrer App.

Wenn Sie diese Datei in Ihrer Anwendung bündeln, können Sie sie mit dem folgenden Code zu Ihrer Seite hinzufügen.

Wenn Sie es von Google CDN einschließen möchten, verwenden Sie den folgenden Code.

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.28//angular-route.min.js"></script>

laden Sie dann das ngRoute Modul in Ihrer Anwendung AngularJS indem sie sie als abhängige Modul hinzugefügt, wie unten dargestellt:

var myApp = angular.module("myApp", ['ngRoute']).controller("SimpleController", ['$scope', function ($scope) { 
//your controller code goes here 
}]);

Quelle

2016-08-08 11:50:02 Keshav

Ich habe das selbst gemacht, bevor thx sowieso – jhony3

Ist irgendein Fehler in der Konsole? – Keshav

Mein AngularJS Routing funktioniert nicht?

Antwort

Verwandte Themen