AngularJS
ng-view
Zoeken…
Invoering
ng-view is een van de ingebouwde richtlijnen die hoekig gebruikt als een container om te schakelen tussen weergaven. {info} ngRoute maakt geen deel meer uit van het bestand base angular.js, dus u moet het bestand angular-route.js opnemen na uw JavaScript-bestand met base angular. We kunnen een route configureren met behulp van de "wanneer" -functie van de $ routeProvider. We moeten eerst de route opgeven en vervolgens in een tweede parameter een object voorzien van een eigenschap templateUrl en een eigenschap controller.
ng-view
ng-view
is een richtlijn die wordt gebruikt met $route
om een gedeeltelijke weergave in de hoofdpaginalay-out weer te geven. Hier in dit voorbeeld is Index.html ons hoofdbestand en wanneer de gebruiker op de "/" -route belandt, wordt de templateURL home.html weergegeven in Index.html waar ng-view
wordt vermeld.
angular.module('ngApp', ['ngRoute'])
.config(function($routeProvider){
$routeProvider.when("/",
{
templateUrl: "home.html",
controller: "homeCtrl"
}
);
});
angular.module('ngApp').controller('homeCtrl',['$scope', function($scope) {
$scope.welcome= "Welcome to stackoverflow!";
}]);
//Index.html
<body ng-app="ngApp">
<div ng-view></div>
</body>
//Home Template URL or home.html
<div><h2>{{welcome}}</h2></div>
Registratie navigatie
- We injecteren de module in de applicatie
var Registration=angular.module("myApp",["ngRoute"]);
- nu gebruiken we $ routeProvider van "ngRoute"
Registration.config(function($routeProvider) {
});
- eindelijk integreren we de route, definiëren we "/ add" routing naar de applicatie voor het geval dat applicatie "/ add" wordt omgeleid naar regi.htm
Registration.config(function($routeProvider) {
$routeProvider
.when("/add", {
templateUrl : "regi.htm"
})
});