angular-ui
V1.1.0 - TypeError: Cannot read properties of undefined (reading 'inherit')
After updating to version 1.1.0 i'm not able to run my app anymore. I use AngularJS 1.8.3.
TypeError: Cannot read properties of undefined (reading 'inherit')
at StateParams.$inherit (factory.js:63:9)
at StateService.href (factory.js:63:9)
at BaseUrlRule.handler (factory.js:63:9)
at UrlService.sync (factory.js:63:9)
at factory.js:63:9
at factory.js:63:9
at Array.forEach (<anonymous>)
at factory.js:63:9
at Scope.$broadcast (factory.js:63:9)
at afterLocationChange (factory.js:63:9)
at factory.js:63:9
at Scope.$digest (factory.js:63:9)
at Scope.$apply (factory.js:63:9)
at bootstrapApply (factory.js:63:9)
at Object.invoke (factory.js:63:9)
at doBootstrap (factory.js:63:9)
(
I did not find any changelog and/or migration instructions. Any help is really appreciated.
Hello, thanx for the answer. I did it, i added "@uirouter/core": "^6.1.0" dep into package.json but still have the same error. Do i need to inject it into the angularjs scope?
I think I found out what the problem is. Do you have params declarations as strings instead of objects?
Uhmmm, params in state are always declared as objects like this:
$stateProvider
.state('myStateName', {
url: '/myPage',
params: {
a: null,
b: null
}
});
I've looked into all the project and unfortunately i didn't find any param defined as string, only objects.
You just showed me the issue :D. The value of the param is null which is not an object :D
@p3pp8 I'm having some issues reproducing the issue in the unit tests. Would you be able to send me a basic state declaration structure that makes this fail? So that I can test my fix.
Hello @wawyed, the example in the post above is extracted from my project (with some renaming) and is a basic state declaration with default params set to null. I think they should've been declared like this:
$stateProvider
.state('myStateName', {
url: '/myPage',
params: {
a: { value: null },
b: { value: null }
}
});
Thank you for the support!
Nothing to do, i've changed all params to have { value: null } instead of null but the error is still there...
Okay... so it's not that.. would you be able to put a breakpoint where it errors and see which param is trying to access?
The project is very complex and loads many angular components with states, i'll try to do my best but it's not as simple as put a breakpoint
The loop in stateParams.js kept adding the word 'chunk' in parentParamsKeys. (node_modules/@uirouter/core/lib-esm/params/stateParams.js)
I don't know what causes that, but I changed the loop from
for (let j in parentParamsKeys) {
if (parentParams[parentParamsKeys[j]].inherit == false || inheritList.indexOf(parentParamsKeys[j]) >= 0)
continue;
inheritList.push(parentParamsKeys[j]);
inherited[parentParamsKeys[j]] = this[parentParamsKeys[j]];
}
to
parentParamsKeys.forEach(j => {
if (parentParams[j].inherit == false || inheritList.indexOf(j) >= 0)
return;
inheritList.push(parentParamsKeys[j]);
inherited[parentParamsKeys[j]] = this[parentParamsKeys[j]];
});
now it works.
I think i have to wait for a new release, but that's not a problem. Thank you guys!
@christ182 can you inspect parentParamsKeys, check Object.keys(parentParamsKeys) wondering if for some reason there's some enumerable properties added to that array?
@wawyed Object.keys is working as expected. It's the loop that does not behave properly.
I found the reason for mine.
Array.prototype.chunk = function(n) {
if (!this.length) {
return [];
}
return [this.slice(0, n)].concat(
this.slice(n).chunk(n)
);
}
for(var i in parents) must include functions as keys.
Although, I have this Array.prototype.chunk code in for some time now. I don't understand how it suddenly broke.
The reason I said Object.keys() it's because it retrieves the enumerable properties of the array. I wasn't referring to the existing Object.keys.
Regardless I think I have a fix based on your latest comment.
I do suggest though that you use Object.defineProperty() instead and make chunk non enumerable to avoid further issues.
