2016-11-07 7 views
1

角度材質ダイアログに2番目の入力を追加しようとしていますが、可能かどうかわかりません。私はTest2プレースホルダを追加しようとしましたが動作しませんでした。事前に助けてくれてありがとう。

$scope.showPrompt = function (ev) { 
    $scope.statusTopic = ''; 
    var confirm = $mdDialog.prompt() 
     .title('Test?') 
     .placeholder('Test1') 
     //.placeholder('Test2') 
     .targetEvent(ev) 
     .ok('Okay!') 
     .cancel('Cancel'); 
+0

あなたはカスタムダイアログを使用しなければならないでしょう。 –

+0

ありがとうございます。私はカスタムダイアログを使用しています。正しい方向/チュートリアル/例を教えてください。 – user6934713

答えて

1

はここでカスタムダイアログを使用した例です - CodePen

マークアップ

<div ng-controller="MyController as vm" ng-cloak="" ng-app="app"> 
    <md-button class="md-primary md-raised" ng-click="vm.open($event)"> 
    Custom Dialog 
    </md-button> 
    <div ng-if="vm.showText" layout="column"> 
    {{vm.placeholder1}} 
    <br> 
    {{vm.placeholder2}} 
    </div> 

    <script type="text/ng-template" id="test.html"> 
    <md-dialog aria-label="Test"> 
     <div layout-padding layout="column"> 
     <md-input-container> 
      <label>Placeholder 1</label> 
      <input ng-model="vm.placeholder1"> 
     </md-input-container> 
     <md-input-container> 
      <label>Placeholder 2</label> 
      <input ng-model="vm.placeholder2"> 
     </md-input-container> 
     <md-button ng-click="vm.save()" class="md-primary">Save</md-button> 
     </div> 
    </md-dialog> 
    </script> 
</div> 

JS

angular.module('app',['ngMaterial']) 

.controller('MyController', function($scope, $mdDialog) { 
    this.open = function(ev) { 
    this.showText = false; 
    $mdDialog.show(
     { 
     templateUrl: "test.html", 
     clickOutsideToClose: true, 
     scope: $scope, 
     preserveScope: true, 
     controller: function($scope) { 
     }, 
    }); 
    }; 

    this.save = function() { 
    this.showText = true; 
    $mdDialog.cancel(); 
    } 
}) 

デモ:

https://material.angularjs.org/latest/demo/input

ドキュメント:

https://material.angularjs.org/latest/api/directive/mdDialog https://material.angularjs.org/latest/api/service/$mdDialog

関連する問題