AngularJS 팝업 창

현재 AngularJS 프로젝트에서 드롭 다운 목록의 사용자 입력과 페이지의 텍스트 상자를 대화 상자 또는 팝업 창에 표시 할 수 있습니다. 예를 들어 Mr의 옵션을 선택하고 이름을 입력하면 대화 상자에 "You Mr Mr YourName"이라고 표시됩니다. 사용자가 제출 버튼을 클릭하면 대화 상자가 나타납니다. 백엔드 기술이없는 단순한 프론트 엔드 애플리케이션. 어떻게 할 수 있습니까? 어떤 도움이 필요합니까? 감사.AngularJS 팝업 창

HTML

<div> 
<label>Pick a title: 
    <select ng-model="data. title"> 
    <option value="Mr">Mr</option> 
    <option value="Mrs">Mrs</option> 
    </select> 
</label>

<div> 
<label>Type your name: 
    <input type="text" ng-model=" data. test"> 
</label> 
</div>

JS 
angular.module("app", []) 
.controller("ctrl", function($scope) { 

$scope.data = { 
title: "Mr", 
text: "test" 
} 

});

출처

2016-07-08 taiwoorogbangba

가 나는 것으로 판단 부트 스트랩, 특히 [모달] (https://angular-ui.github.io/bootstrap/#/modal)의 각도 UI 지침을 권장 정확한 기능을 제공하십시오. – Lex

전체 목적은 단지 값으로 대화 상자를 표시하는 경우, 다음 아래 코드는 당신을 도울 것입니다 , 당신이 bo를 위해 갈 필요가있는 스타일과 다른 특징을 위해 otstrap 모달 및 프롬프트.

HTML

<body ng-controller="MainCtrl"> 
<div> 
<label>Pick a title: 
<select ng-model="data. title"> 
    <option value="Mr">Mr</option> 
    <option value="Mrs">Mrs</option> 
</select> 
</label> 
</div> 
<div> 
<label>Type your name: 
<input type="text" ng-model="data.test"> 
</label> 
</div> 
<input type="submit" ng-click="info()"> 
</body>

컨트롤러.

$scope.data = { 
       title: "Mr", 
       test: "" 
       } 

$scope.info = function() 
{ 
    alert("you are " + $scope.data.title + " " + $scope.data.test) 
}

피들러 : https://plnkr.co/edit/KBA4W4jLPBVX5tHJpWWL?p=preview

출처

2016-07-08 18:04:06 Deep

AngularJS 팝업 창

답변

관련 문제