Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Feature: add method to change inputs in ComponentRef #22567

Closed
dawidgarus opened this issue Mar 3, 2018 · 4 comments
Closed

Feature: add method to change inputs in ComponentRef #22567

dawidgarus opened this issue Mar 3, 2018 · 4 comments
Labels
area: core Issues related to the framework runtime core: change detection core: dynamic view creation core: inputs / outputs feature: under consideration Feature request for which voting has completed and the request is now under consideration feature: votes required Feature request which is currently still in the voting phase feature Issue that requests a new feature
Milestone
Fixit H1'2022

Comments

@dawidgarus
Copy link

I'm submitting a...


[ ] Regression (a behavior that used to work and stopped working in a new release)
[ ] Bug report  
[x] Feature request
[ ] Documentation issue or request
[ ] Support request => Please do not submit support request here, instead see https://github.com/angular/angular/blob/master/CONTRIBUTING.md#question

Current behavior

To change inputs of component creates via ComponentFactory we need to access component instance directly, like that:

componentRef.instance.myInput = 'new value';

Expected behavior

There should exist a method on ComponentFactory that changes inputs, for example:

componentRef.changeInputs({ myInput: 'new value' });

Minimal reproduction of the problem with instructions

N/A

What is the motivation / use case for changing the behavior?

Changing properties on component instance won't call ngOnChanges. You have to do it manually, and that's really annoying because You really can't assume that it's not necessary for component to work correctly.
Calling changeInputs should also call ngOnChanges on component instance. It's also might be a good idea to delay it until change detection is triggered or trigger change detection automatically when changeInputs is called, so ngOnChanges would be called only once before ngDoCheck. Again, some components may rely on ngOnChanges being followed by ngDoCheck.
@devoto13
Copy link
Contributor

devoto13 commented Mar 3, 2018 •
edited

This is a very cool idea. It should also allow to test OnPush components without adding a wrapper component, so should at least partially resolve #12313.

@ngbot ngbot bot added this to the needsTriage milestone Mar 5, 2018
@alexeagle alexeagle added the area: core Issues related to the framework runtime label Mar 5, 2018
@mhevery mhevery added the feature Issue that requests a new feature label Mar 29, 2018
@ngbot ngbot bot modified the milestones: needsTriage, Backlog Mar 29, 2018
Closed
Closed
@kara kara mentioned this issue May 26, 2020
Closed
@angular-robot angular-robot bot added the feature: votes required Feature request which is currently still in the voting phase label Jun 4, 2021
@angular-robot
Copy link
Contributor

angular-robot bot commented Jun 4, 2021

Just a heads up that we kicked off a community voting process for your feature request. There are 20 days until the voting process ends.

Find more details about Angular's feature request process in our documentation.

@angular-robot angular-robot bot added the feature: under consideration Feature request for which voting has completed and the request is now under consideration label Jun 5, 2021
@vzakharov-rxnt
Copy link

Is it still being considered? I think it would be a very useful feature.

Closed
pkozlowski-opensource added a commit to pkozlowski-opensource/angular that referenced this issue Jun 30, 2022
@pkozlowski-opensource
feat(core): add ability to set inputs on ComponentRef
7019681 
This change adds the setInput method to the ComponentRef. This
has two benefits:
- it takes input aliasing into account
- it marks OnPush components as dirty
- it triggers NgOnChanges lifecycle hook

Closes angular#12313
Closes angular#22567
pkozlowski-opensource added a commit to pkozlowski-opensource/angular that referenced this issue Jun 30, 2022
@pkozlowski-opensource
feat(core): add ability to set inputs on ComponentRef
47c4358 
This change adds the setInput method to the ComponentRef.

Previously users had to call `componentRef.instance['inputName']`
to change inputs of a dynamically created component. This had
several problems:

*  OnPush components were not marked for check and thus very
difficult to test;
* input aliasing was not take into account - a property name
on a component could have been different from the actual input
name so setting input properties was fragile;
* manually setting input propertie would NOT trigger the
`NgOnChanges` lifecycle hook.

This modifications unifies `@Input` accross dynamically created
components and the ones referenced in templates. This also opens
doors to other changes: as an example router could use this new
method to set `@Input`s from router params.

Closes angular#12313
Closes angular#22567
pkozlowski-opensource added a commit to pkozlowski-opensource/angular that referenced this issue Jul 1, 2022
@pkozlowski-opensource
feat(core): add ability to set inputs on ComponentRef
b3780ba 
This change adds the setInput method to the ComponentRef.

Previously users had to call `componentRef.instance['inputName']`
to change inputs of a dynamically created component. This had
several problems:

*  OnPush components were not marked for check and thus very
difficult to test;
* input aliasing was not take into account - a property name
on a component could have been different from the actual input
name so setting input properties was fragile;
* manually setting input propertie would NOT trigger the
`NgOnChanges` lifecycle hook.

This modifications unifies `@Input` accross dynamically created
components and the ones referenced in templates. This also opens
doors to other changes: as an example router could use this new
method to set `@Input`s from router params.

Closes angular#12313
Closes angular#22567
pkozlowski-opensource added a commit to pkozlowski-opensource/angular that referenced this issue Jul 1, 2022
@pkozlowski-opensource
feat(core): add ability to set inputs on ComponentRef
39ef803 
This change adds the setInput method to the ComponentRef.

Previously users had to call `componentRef.instance['inputName']`
to change inputs of a dynamically created component. This had
several problems:

*  OnPush components were not marked for check and thus very
difficult to test;
* input aliasing was not take into account - a property name
on a component could have been different from the actual input
name so setting input properties was fragile;
* manually setting input propertie would NOT trigger the
`NgOnChanges` lifecycle hook.

This modifications unifies `@Input` accross dynamically created
components and the ones referenced in templates. This also opens
doors to other changes: as an example router could use this new
method to set `@Input`s from router params.

Closes angular#12313
Closes angular#22567
pkozlowski-opensource added a commit to pkozlowski-opensource/angular that referenced this issue Jul 1, 2022
@pkozlowski-opensource
feat(core): add ability to set inputs on ComponentRef
7363c73 
This change adds the setInput method to the ComponentRef.

Previously users had to call `componentRef.instance['inputName']`
to change inputs of a dynamically created component. This had
several problems:

*  OnPush components were not marked for check and thus very
difficult to test;
* input aliasing was not take into account - a property name
on a component could have been different from the actual input
name so setting input properties was fragile;
* manually setting input propertie would NOT trigger the
`NgOnChanges` lifecycle hook.

This modifications unifies `@Input` accross dynamically created
components and the ones referenced in templates. This also opens
doors to other changes: as an example router could use this new
method to set `@Input`s from router params.

Closes angular#12313
Closes angular#22567
pkozlowski-opensource added a commit to pkozlowski-opensource/angular that referenced this issue Jul 1, 2022
@pkozlowski-opensource
feat(core): add ability to set inputs on ComponentRef
f02ca24 
This change adds the setInput method to the ComponentRef.

Previously users had to call `componentRef.instance['inputName']`
to change inputs of a dynamically created component. This had
several problems:

*  OnPush components were not marked for check and thus very
difficult to test;
* input aliasing was not take into account - a property name
on a component could have been different from the actual input
name so setting input properties was fragile;
* manually setting input propertie would NOT trigger the
`NgOnChanges` lifecycle hook.

This modifications unifies `@Input` accross dynamically created
components and the ones referenced in templates. This also opens
doors to other changes: as an example router could use this new
method to set `@Input`s from router params.

Closes angular#12313
Closes angular#22567
pkozlowski-opensource added a commit to pkozlowski-opensource/angular that referenced this issue Jul 1, 2022
@pkozlowski-opensource
feat(core): add ability to set inputs on ComponentRef
982f88a 
This change adds the setInput method to the ComponentRef.

Previously users had to call `componentRef.instance['inputName']`
to change inputs of a dynamically created component. This had
several problems:

*  OnPush components were not marked for check and thus very
difficult to test;
* input aliasing was not take into account - a property name
on a component could have been different from the actual input
name so setting input properties was fragile;
* manually setting input propertie would NOT trigger the
`NgOnChanges` lifecycle hook.

This modifications unifies `@Input` accross dynamically created
components and the ones referenced in templates. This also opens
doors to other changes: as an example router could use this new
method to set `@Input`s from router params.

Closes angular#12313
Closes angular#22567
@atscott atscott closed this as completed in 96c6139 Jul 1, 2022
@angular-automatic-lock-bot
Copy link

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

This action has been performed automatically by a bot.

@angular-automatic-lock-bot angular-automatic-lock-bot bot locked and limited conversation to collaborators Aug 1, 2022
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Assignees
No one assigned
Labels
area: core Issues related to the framework runtime core: change detection core: dynamic view creation core: inputs / outputs feature: under consideration Feature request for which voting has completed and the request is now under consideration feature: votes required Feature request which is currently still in the voting phase feature Issue that requests a new feature
Projects
None yet
Milestone
Fixit H1'2022
Development

Successfully merging a pull request may close this issue.

feat(core): add ability to set inputs on ComponentRef pkozlowski-opensource/angular
6 participants
@alexeagle @mhevery @devoto13 @pkozlowski-opensource @dawidgarus @vzakharov-rxnt