How to get value from a directive input field using angular

تعرفه تبلیغات در سایت
عنوان عکس عنوان عکس عنوان عکس عنوان عکس
عنوان عکس عنوان عکس عنوان عکس عنوان عکس
عنوان عکس عنوان عکس عنوان عکس عنوان عکس
عنوان عکس عنوان عکس عنوان عکس عنوان عکس
عنوان عکس عنوان عکس عنوان عکس عنوان عکس

آرشیو مطالب

جستجوگر

یافته ها در جستجو

    امکانات وب

    برچسب ها

    I am new to angular.js. I have two directives in my main.js file and every directive has an input text field in the template. There is a Html page (index.html) where I want to use these directive's text fields with another input text field which is a Html input text field.

    Now I want whatever input user gives in both the directive's text fields the character count should be calculated and the sum should be printed in the third text field which is a Html text field.

    Code is given below:-

    **Main.js file code :**
    
        /// <reference path="angular.min.js" />    
    
        var app = angular.module("myApp", []);
    
        app.directive("textbox1"
    
    , function() {
            return {
                restrict: 'E',
                scope: {
                    timezone : "@"
                },
                template: "<div> <input type='text' style='background-color:orange; height=21px; width:151px;' ng-model='txtval1' ng-change='updateval()'/>{{txtval1.length}} </div>"
            }
        }
    );
    app.directive("textbox2", function() {
            return {
                restrict: 'E',
                scope: {
                    timezone: "@"
                },
                template: "<div> <input type='text' style='background-color:orange; height=21px; width:151px;' ng-model='txtval2' ng-change='updateval()'/>{{txtval2.length}} </div>"
            }
        }
    );
    app.controller("myCtrl", function ($scope) {
        $scope.updateval = function () {
            console.log($scope.txtval1.value);
                $scope.txtThird = ($scope.txtval1.length) + ($scope.txtval2.length);
            }
    });
    
    **HTML Page Code :**
    
    <!DOCTYPE html>
    <html>
    <head>
        <title></title>
        <meta charset="utf-8" />
    </head>
    <body>
    
    <div ng-app="myApp">
        <textbox1></textbox1>
        <textbox2></textbox2>
        <br/><br/>
        <input type="text" ng-model="txtThird"/>
    </div>
    
    
    
    <script src="scripts/angular.min.js"></script>
    <script src="scripts/main.js"></script>
    
    </body>
    </html>
    
    

  • مطالب مرتبط
  • The server responded with a status of 400 (Bad Request) in angular Js with wcf service
  • Performance drops when using modulo on double
  • c# com interop returns different value when called from VBA
  • loop through two arrays javascript to search an object by value
  • windowSoftInputMode=“adjustResize” not working after changing visibility of child
  • How to get id from SelectField in material-ui using react?
  • نویسنده : استخدام کار بازدید : 113 تاريخ : چهارشنبه 3 خرداد 1396 ساعت: 22:05
    برچسب‌ها :