Question

我目前正在开发一个AngularJS项目，其中来自下拉列表的用户输入和页面上的文本框可以显示在对话框或弹出窗口中。例如，选择Mr的选项并输入一个名称，然后在对话框中显示为＆＃34;您是YourName先生。＆＃34;当用户单击提交按钮时，应显示该对话框。只是一个简单的前端应用程序，没有后端技术。如何才能做到这一点？有帮助吗？感谢。

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"
}

});

Answer 1

如果你的目的只是为了显示带有值的对话框，那么下面的代码将帮助你，你需要为bootstrap模态和提示设置样式和其他功能。

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)
}

Fiddler：https://plnkr.co/edit/KBA4W4jLPBVX5tHJpWWL?p=preview

AngularJS弹出窗口

1 个答案: