在angularjs中单击复选框时启用文本字段_Angularjs_Checkbox_Textbox

在angularjs中单击复选框时启用文本字段

angularjs checkbox

在angularjs中单击复选框时启用文本字段,angularjs,checkbox,textbox,Angularjs,Checkbox,Textbox,我对angularjs很陌生，我会告诉你我应该取得什么成就网页中有三个项目，（i）复选框（ii）文本框1 （iii）文本框2 文本框1始终为只读，其中包含一些文本单击复选框后，文本框2应为可编辑文本框，该文本框初始为只读，且与文本框1中的文本相同我必须用angularjs来做请提供帮助因为您有应用程序和控制器，您可以执行以下操作：将复选框绑定到变量执行以下操作：现在，$scope有一个名为checked的属性。选中复选框时，$scope.checked值将为true 在文本字段

我对angularjs很陌生，我会告诉你我应该取得什么成就

网页中有三个项目，（i）复选框（ii）文本框1 （iii）文本框2

文本框1始终为只读，其中包含一些文本

单击复选框后，文本框2应为可编辑文本框，该文本框初始为只读，且与文本框1中的文本相同

我必须用angularjs来做

请提供帮助

因为您有应用程序和控制器，您可以执行以下操作：

将复选框绑定到变量执行以下操作：

现在，$scope有一个名为checked的属性。选中复选框时，$scope.checked值将为true

在文本字段上写ng readonly=“checked” 给你：

HTML文件：

<!DOCTYPE html>
<html ng-app="myApp">

<head>
  <meta charset="utf-8" />
  <title>AngularJS Plunker</title>

  <script src="//cdnjs.cloudflare.com/ajax/libs/angular.js/1.3.3/angular.js"></script>
  <script src="app.js"></script>
</head>

<body ng-controller="MyController">
  <input type="checkbox" ng-model="myCheckbox" ng-change="cbSelected()" />
  <input type="text" ng-model="text1" readonly />
  <input type="text" ng-model="text2" ng-readonly="!myCheckbox" />
</body>

</html>

看到它在这里工作：

如果有任何疑问，请提问并阅读文档。

您尝试过什么吗？

'use strict';
angular.module('myApp', [])
.controller('MyController', function($scope) {

  $scope.text1 = 'some-text';

  $scope.cbSelected = function() {
      if ($scope.myCheckbox) {  // when checked
        $scope.text2 = angular.copy($scope.text1);
      } else {
        $scope.text2 = "";
      }
  };
});