नीचे मेरे माता-पिता/बच्चे राज्यों और index.html फ़ाइल का एक उदाहरण है जो मेरे कोणीय ऐप को प्रस्तुत करता है। toastr
संदेश बच्चे के राज्यों में दिखाई देते हैं, सुनिश्चित नहीं है कि क्यों। निर्भरता को प्रत्येक नियंत्रक में अपेक्षित के रूप में शामिल किया गया है।टोस्टर ui-राउटर बाल राज्यों में दिखाई नहीं देता
config.js
(function(){
'use strict'
var app = angular.module('core');
app.config(AppRouter);
AppRouter.$inject = ['$stateProvider', '$urlRouterProvider'];
function AppRouter($stateProvider, $urlRouterProvider){
$urlRouterProvider.otherwise('/home');
$stateProvider
.state('/', {
templateUrl: 'app/components/home/home.html',
controller: 'HomeController',
controllerAs: 'vm',
parent: 'app',
authenticate: true,
resolvePolicy: {when:'LAZY', async: 'WAIT'},
resolve:{
security:['$q', '$rootScope', 'privileges', 'routeErrors', function($q, $rootScope, privileges, routeErrors){
if($rootScope.isLoggedIn()){
return $q.resolve();
} else {
return $q.reject(routeErrors.NOT_LOGGED_IN);
}
}]
}
})
.state('app', {
url:'',
abstract: true,
template: '<div ui-view class="slide-animation"></div>',
resolve:{
privileges: ['privilegesService', function(privilegesService){
return privilegesService.getPrivileges()
.then(privilegesService.privilegesData)
.catch(privilegesService.getPrivilegesError);
}],
alarms: ['alarmsService', function(alarmsService){
return alarmsService.setAlarms();
}],
firmsData: ['chosenFirmService', function(chosenFirmService){
return chosenFirmService.getFirmsData();
}],
notifications: ['notificationsService', function(notificationsService){
notificationsService.loadNotificationData();
return notificationsService.setupGlobalAccess();
}],
releaseNotes: ['releaseNotesService', function(releaseNotesService){
return releaseNotesService.setupGlobalAccess();
}],
setIdle: ['idleService', function(idleService){
return idleService.setIdle();
}]
}
})
.state('home', {
url: '/home',
templateUrl: 'app/components/home/home.html',
controller: 'HomeController',
controllerAs: 'vm',
parent: 'app',
authenticate: true,
resolvePolicy: {when:'LAZY', async: 'WAIT'},
resolve:{
security:['$q', '$rootScope', 'privileges', 'routeErrors', function($q, $rootScope, privileges, routeErrors){
if($rootScope.isLoggedIn()){
return $q.resolve();
} else {
return $q.reject(routeErrors.NOT_LOGGED_IN);
}
}]
}
})
}
app.config(Toastr);
function Toastr(toastrConfig) {
angular.extend(toastrConfig, {
autoDismiss: true,
containerId: 'toast-container',
maxOpened: 0,
newestOnTop: true,
positionClass: 'toast-top-center',
preventDuplicates: false,
preventOpenDuplicates: true,
target: 'body',
timeOut: 5000
});
};
})();
index.html
<body data-ng-cloak>
<div ng-include="'app/shared/partials/navbar.html'"></div>
<div class="slide-animation-container">
<div ui-view id="ng-view" class="slide-animation"></div>
{{scrollTo}}
</div>
<div ng-include="'app/shared/partials/footer.html'"></div>
<div ng-include="'app/shared/partials/loading.html'"></div>
</body>
नमूना नियंत्रक
EditFirmController.$injectParams = ['$filter', '$window', '$rootScope', 'toastr'];
function EditFirmController($filter, $window, $rootScope, toastr) {
var editFirmFail = function(resp){
resetDropDowns();
toastr.error($rootScope.ResponseFailMessage(resp), "Update failed.");
};
(इस 'ऐप्लिकेशन' के हर बच्चे को राज्य में होता है)
गाया एचटीएमएल
क्या आपने टोस्टर लाइब्रेरी को अपने कोणीय ऐप की निर्भरता के रूप में रखा था? कुछ 'angular.module (' ऐप ', [' टोस्टर '] जैसे कुछ' – MarkoCen
हां, इसमें शामिल है। टोस्टर संदेश एचटीएमएल में दिखाई देते हैं, हालांकि वे बस दिखाई नहीं दे रहे हैं। – NealR
क्या आप इसे प्लंकर/फीडल/कोडेपेन में पुन: उत्पन्न करने में सक्षम हैं? –