Geek Answers Handbook

Use permission with angleularjs component

I am trying to resolve a list of clients before the page is displayed.

Here is a vendor vendor link where I have solution methods.

angular.module('app') .config(($stateProvider) => { $stateProvider .state('customers', { url: '/customers', template: '<customers></customers>', resolve: { test: function () { return 'nihao'; }, }, }); });

The following is the component that should have called #test from the solution. All you have to do is type the word "nihao" on the console.

 (function myCustomersConfig() { class MyCustomersComponent { constructor(test) { this.test = test; console.log(this.test); } angular.module('app').component('myCustomers', { templateUrl: 'app/customers/customers.html', controller: MyCustomersComponent, }); }());

However, I keep getting this error:

 angular.js:13708 Error: [$injector:unpr] Unknown provider: testProvider <- test http://errors.angularjs.org/1.5.7/$injector/unpr?p0=testProvider%20%3C-%20test at angular.js:68 at angular.js:4502 at Object.getService [as get] (angular.js:4655) at angular.js:4507 at getService (angular.js:4655) at injectionArgs (angular.js:4679) at Object.invoke (angular.js:4701) at $controllerInit (angular.js:10234) at nodeLinkFn (angular.js:9147) at angular.js:9553

I see that it launches permission functions, therefore it works, but it will not introduce methods! Any ideas?

+5
source share
2 answers

Your code lacks an attribute and a binding to allow work.

 angular.module('app') ... template: '<customers test="$resolve.test"></customers>', resolve: { test: function () { return {value: 'nihao'}; } }, ... }); (function myCustomersConfig() { function MyCustomersComponent { // You can use test right away, and also view as $ctrl.test console.log(this.test); } angular.module('app') .component('myCustomers', { templateUrl: 'app/customers/customers.html', controller: MyCustomersComponent, bindings: { test: "<", } }); }());
+6
source

Add bindings to your component and remove it from your controller function

 angular.module('app').component('myCustomers', { templateUrl: 'app/customers/customers.html', controller: MyCustomersComponent, bindings: { 'test': '<' // or @ for string } }); class MyCustomersComponent { constructor() { // this.test should already exist console.log(this.test); } ....
+1
source

More articles:


All Articles