How to attach input filed to another in Angular 2 only if it's pristine?












0















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)










share|improve this question























  • whatever you tried it happening the same right?

    – ashish pal
    Jan 3 at 10:40
















0















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)










share|improve this question























  • whatever you tried it happening the same right?

    – ashish pal
    Jan 3 at 10:40














0












0








0








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)










share|improve this question














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






share|improve this question













share|improve this question











share|improve this question




share|improve this question










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



















  • 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












2 Answers
2






active

oldest

votes


















2














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






share|improve this answer































    1














    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;
    }





    share|improve this answer























      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
      });


      }
      });














      draft saved

      draft discarded


















      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









      2














      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






      share|improve this answer




























        2














        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






        share|improve this answer


























          2












          2








          2







          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






          share|improve this answer













          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







          share|improve this answer












          share|improve this answer



          share|improve this answer










          answered Jan 3 at 10:40









          pavan skipopavan skipo

          521114




          521114

























              1














              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;
              }





              share|improve this answer




























                1














                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;
                }





                share|improve this answer


























                  1












                  1








                  1







                  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;
                  }





                  share|improve this answer













                  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;
                  }






                  share|improve this answer












                  share|improve this answer



                  share|improve this answer










                  answered Jan 3 at 10:35









                  Abhishek EkaanthAbhishek Ekaanth

                  1,1561125




                  1,1561125






























                      draft saved

                      draft discarded




















































                      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.




                      draft saved


                      draft discarded














                      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





















































                      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







                      Popular posts from this blog

                      Monofisismo

                      Angular Downloading a file using contenturl with Basic Authentication

                      Olmecas