简体   繁体   中英

ngRoute doesn't seem to work. angular 1.5.7

I know there is a few questions on this topic, but none of theme helped me resolved my problem.

I have : - 404 error - browserLink:37 [Deprecation] Synchronous XMLHttpRequest on the main thread is deprecated because of its detrimental effects to the end user's experience. For more help, check https://xhr.spec.whatwg.org/ . warning

html:

<script src="~/app/app.js"></script>
<script src="~/app/controller.js"></script>
<script src="~/app/parkingCtrl.js"></script>

app.js

(function (angular) {
'use strict';

angular.module("app", ["ngRoute"])

    .config(['$routeProvider', '$httpProvider', '$locationProvider', 
      function ($routeProvider, $httpProvider, $locationProvider) {

        $locationProvider.html5Mode({
            enabled: true,
            requireBase: false
        });

        $httpProvider.defaults.headers.common["X-Requested-With"] = "XMLHttpRequest";


        $routeProvider.
            when("/parking", {
                template: '/locelec/voiturelist',
                controller: "parkingCtrl",
            });

    }]) 



})(window.angular);

1 file

angular.module('app').controller('FirstController', function () { });

2 file

angular.module('app').controller('parkingCtrl', ['$rootScope', '$scope', '$routeParams', 
  function ($rootScope, $scope, $routeParams) {

}]);

have spend all weekend trying to figure out the routing, start to desperate :) Thank you for your help. best regards.

vue :

<script type="text/ng-template" id="/locelec/voiturelist">
<div class="page page-dashboard ng-scope" ng-controller="parkingCtrl">

  <div class="row">
    <div class="col-md-12">
      <h1>Voitures</h1>
    </div>
  </div>
  <div class="row">
    <div class="col-md-12">
      <a class="btn btn-primary" role="button" href="#/bicycles/new">
        Ajoutez nouveau voiture
      </a>
    </div>
  </div>
  <div class="row">
    <div class="col-md-12">
      &nbsp;
    </div>
  </div>
  <div class="row">
    <div class="col-md-12">
      <table class="table table-bordered table-striped">
        <thead>
          <tr>
            <th>Id</th>
            <th>Marque</th>
            <th>Modele</th>
            <th>Carburant</th>
            <th>Numbre de Portes</th>
            <th>Transmission</th>
            <th>Consommation</th>
            <th></th>
          </tr>
        </thead>
        <tbody>
          <tr ng-repeat="vehicule in model.listvehicules | filter: {TypeVehicule : 'voiture'}">
            <td>{{vehicule.Id}}</td>
            <td>{{vehicule.Marque}}</td>
            <td>{{vehicule.Modele}}</td>
            <td>{{vehicule.Carburant}}</td>
            <td>{{vehicule.NumPortes}}</td>
            <td>{{vehicule.Transmission}}</td>
            <td>{{vehicule.Consommation}}</td>
            <!--<td>
              <a class="btn btn-default" role="button" 
                 ng-link="['VoitureEdit', {id: vehicule.Id}]">
                Edit {{vehicule.Id}}
              </a>
            </td>-->
            <td>
              <a class="btn btn-default" role="button" ng-link="['VoitureEdit']">
                 Edit VoitureEdit
              </a>
            </td>
          </tr>
        </tbody>
      </table>
    </div>
  </div>
</div>
</script>

The key problem was

<ng-view></ng-view>

missing.

I realise it with help of this really nice tutorial. Angularjs route configuration

Thank you all guys !

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM