How to attach input filed to another in Angular 2 only if it's pristine?
I have two input fields:
<input type="text" [(ngModel)]="title" name="title">
<input type="text" [(ngModel)]="og_title" name="og_title" value="{{ title }}">
I want to make the og_title
field to equal to title
until og_title is pristine.
How can I do this in Angular 2
(Angular 7)
angular angular7 angular2-ngmodel
add a comment |
I have two input fields:
<input type="text" [(ngModel)]="title" name="title">
<input type="text" [(ngModel)]="og_title" name="og_title" value="{{ title }}">
I want to make the og_title
field to equal to title
until og_title is pristine.
How can I do this in Angular 2
(Angular 7)
angular angular7 angular2-ngmodel
whatever you tried it happening the same right?
– ashish pal
Jan 3 at 10:40
add a comment |
I have two input fields:
<input type="text" [(ngModel)]="title" name="title">
<input type="text" [(ngModel)]="og_title" name="og_title" value="{{ title }}">
I want to make the og_title
field to equal to title
until og_title is pristine.
How can I do this in Angular 2
(Angular 7)
angular angular7 angular2-ngmodel
I have two input fields:
<input type="text" [(ngModel)]="title" name="title">
<input type="text" [(ngModel)]="og_title" name="og_title" value="{{ title }}">
I want to make the og_title
field to equal to title
until og_title is pristine.
How can I do this in Angular 2
(Angular 7)
angular angular7 angular2-ngmodel
angular angular7 angular2-ngmodel
asked Jan 3 at 10:25
netdjwnetdjw
1,23883560
1,23883560
whatever you tried it happening the same right?
– ashish pal
Jan 3 at 10:40
add a comment |
whatever you tried it happening the same right?
– ashish pal
Jan 3 at 10:40
whatever you tried it happening the same right?
– ashish pal
Jan 3 at 10:40
whatever you tried it happening the same right?
– ashish pal
Jan 3 at 10:40
add a comment |
2 Answers
2
active
oldest
votes
I think it would be better if you use Reactive forms instead of two way binding with ngModel, but still this would work :
<input type="text" [(ngModel)]="title" name="title" (input)="titleChanged()">
<input type="text" [(ngModel)]="og_title" name="og_title">
and in the TS file :
titleChanged(){
if(<code to check if og_title is pristine>){
this.og_title = this.title;
}
}
replace the <code to check if og_title is pristine>
with logic that includes name of the form and pristine condition of input field
add a comment |
you can assign to the ngModel
HTML
<input type="text" [(ngModel)]="title" name="title" (input)="assignToModel($event)">
<input type="text" [(ngModel)]="og_title" name="og_title" value="{{ title }}">
TS:
assignToModel(event){
this.og_title = event.target.value;
}
add a comment |
Your Answer
StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f54020387%2fhow-to-attach-input-filed-to-another-in-angular-2-only-if-its-pristine%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
2 Answers
2
active
oldest
votes
2 Answers
2
active
oldest
votes
active
oldest
votes
active
oldest
votes
I think it would be better if you use Reactive forms instead of two way binding with ngModel, but still this would work :
<input type="text" [(ngModel)]="title" name="title" (input)="titleChanged()">
<input type="text" [(ngModel)]="og_title" name="og_title">
and in the TS file :
titleChanged(){
if(<code to check if og_title is pristine>){
this.og_title = this.title;
}
}
replace the <code to check if og_title is pristine>
with logic that includes name of the form and pristine condition of input field
add a comment |
I think it would be better if you use Reactive forms instead of two way binding with ngModel, but still this would work :
<input type="text" [(ngModel)]="title" name="title" (input)="titleChanged()">
<input type="text" [(ngModel)]="og_title" name="og_title">
and in the TS file :
titleChanged(){
if(<code to check if og_title is pristine>){
this.og_title = this.title;
}
}
replace the <code to check if og_title is pristine>
with logic that includes name of the form and pristine condition of input field
add a comment |
I think it would be better if you use Reactive forms instead of two way binding with ngModel, but still this would work :
<input type="text" [(ngModel)]="title" name="title" (input)="titleChanged()">
<input type="text" [(ngModel)]="og_title" name="og_title">
and in the TS file :
titleChanged(){
if(<code to check if og_title is pristine>){
this.og_title = this.title;
}
}
replace the <code to check if og_title is pristine>
with logic that includes name of the form and pristine condition of input field
I think it would be better if you use Reactive forms instead of two way binding with ngModel, but still this would work :
<input type="text" [(ngModel)]="title" name="title" (input)="titleChanged()">
<input type="text" [(ngModel)]="og_title" name="og_title">
and in the TS file :
titleChanged(){
if(<code to check if og_title is pristine>){
this.og_title = this.title;
}
}
replace the <code to check if og_title is pristine>
with logic that includes name of the form and pristine condition of input field
answered Jan 3 at 10:40
pavan skipopavan skipo
521114
521114
add a comment |
add a comment |
you can assign to the ngModel
HTML
<input type="text" [(ngModel)]="title" name="title" (input)="assignToModel($event)">
<input type="text" [(ngModel)]="og_title" name="og_title" value="{{ title }}">
TS:
assignToModel(event){
this.og_title = event.target.value;
}
add a comment |
you can assign to the ngModel
HTML
<input type="text" [(ngModel)]="title" name="title" (input)="assignToModel($event)">
<input type="text" [(ngModel)]="og_title" name="og_title" value="{{ title }}">
TS:
assignToModel(event){
this.og_title = event.target.value;
}
add a comment |
you can assign to the ngModel
HTML
<input type="text" [(ngModel)]="title" name="title" (input)="assignToModel($event)">
<input type="text" [(ngModel)]="og_title" name="og_title" value="{{ title }}">
TS:
assignToModel(event){
this.og_title = event.target.value;
}
you can assign to the ngModel
HTML
<input type="text" [(ngModel)]="title" name="title" (input)="assignToModel($event)">
<input type="text" [(ngModel)]="og_title" name="og_title" value="{{ title }}">
TS:
assignToModel(event){
this.og_title = event.target.value;
}
answered Jan 3 at 10:35
Abhishek EkaanthAbhishek Ekaanth
1,1561125
1,1561125
add a comment |
add a comment |
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f54020387%2fhow-to-attach-input-filed-to-another-in-angular-2-only-if-its-pristine%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
whatever you tried it happening the same right?
– ashish pal
Jan 3 at 10:40