我正在尝试打开编辑页面:
<div id="edit" class="span6" ng-controller="BrandsCtrl">
<script type="text/ng-template" id="editPage">
<div class="row-fluid sortable">
<div class="box span12" ng-app="myApp">
<div class="box-content">
<form class="form-horizontal" action='/admin.brands/update' data-toggle="validate" method="post">
<input type="hidden" name="brandid" value="{{brand.brandid}}"/>
<div class="section-heading"></div>
<div class="control-group">
<label class="control-label" for="selectError"><tags:label text="name"/> *</label>
<div class="controls">
<input name="name" value="{{brand.name}}" required/>
</div>
</div>
<div class="control-group">
<label class="control-label" for="selectError"><tags:label text="isactive"/> </label>
<div class="controls">
<input type="checkbox" ng-checked="post.isactive" name="isactive" value="1"/>
</div>
</div>
<div class="form-actions">
<a href="/admin.brands" class="btn btn-ext-lightblue"><tags:label text="close"/></a>
<button type="submit" class="btn btn-ext-darkblue btn-disable-on-submit" ><tags:label text="save"/></button>
</div>
</form>
</div>
</div>
</script>
</div>
通过点击按钮:
<a class="btn btn-ext-darkblue btn-ext-darkblue savestockbtn" ng-click="open()"><tags:label text="edit"/></a>
但是当我点击它时,当前页面以模式打开。
如何将 editPage 显示为模态?我做错了什么?如何修复此代码?
这是我的控制器:
var app = angular.module('myApp', ['ui.bootstrap']);
app.controller("BrandsCtrl", function($scope, $http, $controller) {
$http.get('http://localhost/admin.brands/getJSONDataOfSearch').
success(function(data, status, headers, config) {
$scope.brands = data;
}).
error(function(data, status, headers, config) {
});
angular.extend(this, $controller("BrandCtrl", {$scope: $scope}));
});
app.controller("BrandCtrl", function($scope, $http, $modal) {
$http.get('http://localhost/admin.brands/getJsonBrandAndEdit?brandid=1').
success(function(data, status, headers, config) {
$scope.brand = data;
}).
error(function(data, status, headers, config) {
});
$scope.animationsEnabled = true;
$scope.open = function (size) {
var modalInstance = $modal.open({
animation: $scope.animationsEnabled,
templateUrl: 'editPage',
size: size,
resolve: {
item: function () {
return $scope.brand;
}
}
});
}});