Two way databinding in AngularJS using Asp.Net

Two way databinding in AngularJS

We have a two way data binding when a model variable is bound to a HTML element that can both change and display the value of the variable.

We use the ng-model directive to bind a model variable to the HTML element that can not only display its value, but also change it.



<html xmlns="">
<head runat="server">
    <title>Two way databinding in AngularJS</title>
             <script src = ""></script>

    <script type="text/javascript">

        var myapp = angular.module("blogmodul", []);

        myapp.controller("blogcontroller", function ($scope) {

            $scope.message = "dotnetdrizzles";
            var blog = {
                name: "Dotnetdrizzles",
                domain: "",
                provider : "Google"
            $ = blog;


<body ng-app="blogmodul">
    <form id="form1" runat="server">
    <div align="center" ng-controller="blogcontroller">
                <h1>Two way databinding in AngularJS</h1>

        <asp:TextBox ID="TextBox1" ng-model="message"  runat="server"></asp:TextBox>
        {{message}}   <br />
     NAME:  <asp:Label ID="Label1" runat="server" ForeColor="Red" Text="{{}}"></asp:Label><br />
      DOMAIN:  <asp:Label ID="Label2" runat="server" ForeColor="Red" Text="{{blog.domain}}"></asp:Label><br />
       PROVIDER: <asp:Label ID="Label3" runat="server" ForeColor="Red" Text="{{blog.provider}}"></asp:Label><br />

Add new web form -Add- Anjular.js plugins - create model and controller with some conditions below 

Next - Add ng-app in <body> tag  - Next - Add Controller in <div> tag - ng-model  bind to Textbox and changeable  - Next - Add object value bind from conditions 


Post a Comment