RanceAmit Ответов: 3

Отображаемое значение из текстового поля в другое текстовое поле с помощью AngularJS на кнопку нажать

Новое в AngularJs. Нахожу его немного сложным. Я создал два текстовых поля и кнопку. Теперь я хочу, сначала я напишу что-то внутри первого текстового поля. Тогда я нажму на кнопку. После этого значение первого текстового поля будет отображаться внутри второго текстового поля. Я написал очень мало кода, я даже не упомянул функцию нажатия кнопки, так как я запутался в этом. Пожалуйста, помогите мне идти дальше.
<script src="../../Scripts/angular.min.js" type="text/javascript"></script>
</head>
<body>
    <div ng-app="">
        <input type="text" ng-model="type">
        <br />
        <br />
        <input type="button" value="button" onclick="myFunction()" />
        <br />
        <br />
        <input type="text" ng-model="display" />
    </div>
</body>

3 Ответов

Рейтинг:
0

Nakul Chaudhari

проверьте это ... пример углового JS

http://stackoverflow.com/questions/21693403/angularjs-action-on-click-of-button[^]

Рейтинг:
0

Sreekanth Mothukuru

Вот обновленный код

HTML:

в <div с НГ-приложение="приложение" НГ-контроллер="myButtonCtrl"&ГТ;
в <тип входного="текст" НГ-модель="источник"и GT;
< br / & gt;
< br / & gt;
в <тип входного="кнопка кнопка" значение="" НГ-нажмите кнопку="copyText(источник);" /&ГТ;
< br / & gt;
< br / & gt;
в <тип входного="текст" НГ-модель="место назначения" /&ГТ;
< / div>

и JavaScript: 

var myButtonApp = angular.module("myApp", []);

        myButtonApp.controller("myButtonCtrl", [
            "$scope", function ($scope) {

                $scope.source = "Sample text to copy";
                $scope.destination = "";
                copyText = function (obj) {
                    alert(obj);
                    $scope.destination = obj;
                };
                $scope.copyText = copyText;
            }
        ]);

Рейтинг:
0

Surya R Praveen 

<!doctype html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <script src="//code.angularjs.org/snapshot/angular.min.js"></script>
</head>

<body ng-app="textInputExample">
  <script>
    angular.module('textInputExample', [])
      .controller('ExampleController', ['$scope', function($scope) {
        $scope.example = {
          text: 'guest',
          word: /^\s*\w*\s*$/
        };
      }]);
  </script>
  <form name="myForm" ng-controller="ExampleController">
    <label>Single word:
      <input type="text" name="input" ng-model="example.text" ng-pattern="example.word" required ng-trim="false">
      <input type="text" name="copy" ng-pattern="example.word" value="{{example.text}}">
    </label>
    <div role="alert">
      <span class="error" ng-show="myForm.input.$error.required">

      Required!</span>
      <span class="error" ng-show="myForm.input.$error.pattern">

      Single word only!</span>
    </div>
    <code>text = {{example.text}}</code>
    <br/>
    <code>myForm.input.$valid = {{myForm.input.$valid}}</code>
    <br/>
    <code>myForm.input.$error = {{myForm.input.$error}}</code>
    <br/>
    <code>myForm.$valid = {{myForm.$valid}}</code>
    <br/>
    <code>myForm.$error.required = {{!!myForm.$error.required}}</code>
    <br/>
  </form>
</body>

</html>
<a href="https://plnkr.co/edit/YS8cX7AOGh3xd4aVroAN?p=preview">DEMO</a>