私はウェブにAngualrを使用しています。テキストが変更された後に新しいボタンを追加します
<div class="form-group">
<div class="text-form" style="float: left;">Companion URL</div>
<input type="text" placeholder="Companion URL" class="companion-url-box" ng-model="newCreative.companionUrl">
</div>
は、私は、テキストの変更は、それがダウンして新しいボタンを追加する時期（コントローラに）メソッドを追加することにしたい： 私はhtmlコードでこの部分を持っています。 どうすればいいですか？ ng-changeの仕組みを理解できません。
おかげ
単にnewCreative.companionUrlがスコープ内に存在するかどうかを確認するためにng-ifを使用します。
<div class="form-group">
<div class="text-form" style="float: left;">Companion URL</div>
<input type="text" placeholder="Companion URL" class="companion-url-box" ng-model="newCreative.companionUrl">
<input type="button" value="Click me" ng-if="newCreative.companionUrl">
</div>
ます。また、ボタンの可視性を検証する機能を使用することができます。
index.htmlを
<!doctype html>
<html lang="en" ng-app="app">
<head>
<meta charset="utf-8">
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.6.1/angular.min.js"></script>
<script src="scripts.js"></script>
</head>
<body ng-controller="SampleController as ctrl">
<div class="form-group">
<div class="text-form" style="float: left;">Companion URL</div>
<input type="text" placeholder="Companion URL" class="companion-url-box" ng-model="newCreative.companionUrl">
<input type="button" value="Click me" ng-if="ctrl.isButtonAvailable()">
</div>
</body>
</html>
script.js
angular.module('app', []);
angular.module('app').controller('SampleController', function ($scope) {
var ctrl = this;
ctrl.isButtonAvailable = function() {
if(!$scope.newCreative) {
return false;
}
// Ensure companion url starts with https:// using a regular expression
return /^https:\/\//.test($scope.newCreative.companionUrl);
}
});
の作業例
このPlunkerをチェックアウト：https://plnkr.co/edit/n8VtJrenePGf9hCbmzWJ
あなたは、入力とNG-IFまたは上NG-ショーでディレクティブのNG-変更を使用することができますボタンとコントローラーの少しのコードがあります。
このチェック：
http://codepen.io/mQuixaba/pen/oZqXWG?editors=1111
HTML：
<div ng-app="myApp" ng-controller="MyController">
<label for="input">Text:</label>
<input type="text" id="input" ng-model="text" ng-change="showButton=true"/>
<button ng-if="showButton" ng-click="hideButton()">My Button</button>
</div>
JS：
angular
.module('myApp', [])
.controller('MyController', function($scope){
$scope.showButton = false;
$scope.text = "My text";
$scope.hideButton = function() {
$scope.showButton = false;
}
});
何の条件に基づいてテキストの変更はボタンつもりが追加されます？ –
申し訳ございませんが、 –
https://www.w3schools.com/angular/tryit.asp?filename=try_ng_ng-changeの質問とng-chageの例が分かりません。AngularJSサイトを次のように確認してください。よくhttps://docs.angularjs.org/api/ng/directive/ngChange – poohbear