2017-08-11 13 views
-1

私は次のようにする必要があります。ドロップダウンメニューに入力値が表示されますAngularJS

<div class="dropdown"> 
      <button class="btn btn-default dropdown-toggle" type="button" data-toggle="dropdown">Type 
       <span class="caret"></span></button> 
       <ul class="dropdown-menu"> 
       <li><button>login</button></li> 
       <li><a>password</a></li> 
       </ul> 
       </div> 

<input class="form-control" name="type" placeholder="value" ng-model="value"> 

Plunker:事前に助けをhttp://plnkr.co/edit/g1t4pludTTIAJYKTToCK?p=preview

おかげ<ul class="dropdown-menu">で "ログイン" し、入力テキストにpassword

$scope.logins = [{ 
     "login" : "log", 
     "password" : "pass" 
    }] 

HTMLとlogin$scope.loginsから同じことを示しています!

+0

問題点は何ですか?これまでに何を試しましたか? –

+1

[入力AngularJSの値を表示する]の可能な複製(https://stackoverflow.com/questions/45458970/select-shows-value-in-input-angularjs) – Vivz

答えて

0

var app = angular.module("myApp", []); 
 
app.controller("myCtrl", function($scope) { 
 

 
});
<!DOCTYPE html> 
 
<html> 
 
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script> 
 

 
<!-- Latest compiled and minified CSS --> 
 
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"> 
 

 
<script src="script.js"></script> 
 

 
<script src="http://angular-ui.github.io/bootstrap/ui-bootstrap-tpls-0.12.0.min.js"></script> 
 

 
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> 
 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 
 

 
<body> 
 

 
    <div ng-app="myApp" ng-controller="myCtrl"> 
 
    <div class="dropdown"> 
 
     <button class="btn btn-default dropdown-toggle" type="button" data-toggle="dropdown">Type 
 
       <span class="caret"></span></button> 
 
     <ul ng-init="placeholder = ''" class="dropdown-menu"> 
 
     <li ng-click="placeholder = 'login'"><a>login</a></li> 
 
     <li ng-click="placeholder = 'password'"><a>password</a></li> 
 
     </ul> 
 
    </div> 
 

 
    <input class="form-control" name="type" placeholder="{{placeholder}}" ng-model="value"> 
 
    </div>

1

ng-clickliにタグとinit valueモデルを追加してみます。

<li ng-click="value = logins[0].login"><a >login</a></li> 
    <li ng-click="value = logins[0].password"><a >password</a></li> 
+0

私は値に「ログイン」したくない、私はlogins.loginをこの '

  • login
  • 'にアップデートするために – bafix2203

    +0

    を入れたいと思います。 –

    関連する問題