how to parse html input value to json data at angular2 using typeScript

Question

I am new to angularJS2.It might be a dummy question for you I searched many forums and failed about getting input value to json value in typeScript. You know how I should write my submit() function to get input values from screen and console it to screen when I click submit button? You can find the codes below. Please let me know if you have inquiries .

Regards

   <!DOCTYPE html> 
    <html>
   <form name="myForm" ng-submit="submit()">
       <head>
        <link rel="stylesheet" href="guiTransformatorStyles.css">
      </head>
    <body>
    <table>
     <br>
       <ul class="nav nav-pills nav-stacked">
      <tr><td>   <input type="text" value="&nbsp;" ng-model="myForm.productName">                                                                                   </td></tr>
    </ul>
    </table>
   </body>
        </form>
     </html>

This is my typeScript file :

 import { Component, OnInit} from '@angular/core';
  import { Router } from '@angular/router';
 import { FormGroup, FormBuilder } from '@angular/forms';
 import { Http } from '@angular/http';


 @Component({
   moduleId: module.id,
  templateUrl: 'navigation.component.html',
   host: {'(window:keydown)' : 'hotkeys($event)'},

 })

export class NavigationComponent implements OnInit {

 form: FormGroup;

 ngOnInit(): void { }

 constructor(private router: Router) {

 }



 submit() {
   alert('submit');
 }


  }

...ng-model and ng-submit are AngularJS syntax....

AVJT82
– AVJT82

2017-03-16 08:51:23 +00:00
Commented Mar 16, 2017 at 8:51 — AVJT82
– AVJT82, Commented Mar 16, 2017 at 8:51
plnkr Like this?

Lon Yang
– Lon Yang

2017-03-16 08:57:36 +00:00
Commented Mar 16, 2017 at 8:57 — Lon Yang
– Lon Yang, Commented Mar 16, 2017 at 8:57

YounesM · Accepted Answer · 2017-03-16 09:07:30Z

1

As @AJT_82 said. You are using AngularJS syntax in a Angular 2 project. Use [(ngModel)] and (submit) instead of ng-model and ng-submit.

(Not to mention that you are starting a form in the head of your html and using body / head in a template)

answered Mar 16, 2017 at 9:07

YounesM

2,31717 silver badges30 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

how to parse html input value to json data at angular2 using typeScript

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related