我有一个表单中的三个 angular-ui-bootstrap typehead
<form>
<div class="form-group">
<label for="fieldname" class="col-md-3 control-label">Name</label>
<div class="col-md-6">
<input type="text" ng-model="newItem.customSelected" typeahead="name as name.name for name in members | filter:{name:$viewValue}" class="form-control" />
</div>
</div>
<div class="form-group">
<label for="fieldhname" class="col-md-3 control-label">House name</label>
<div class="col-md-6">
<input type="text" ng-model="newItem.customSelected1" typeahead="house_name as house_name.house_name for house_name in family | filter:{house_name:$viewValue}" class="form-control" />
</div>
</div>
<div class="form-group">
<label for="" class="col-md-3 control-label"><?php echo $this->lang->line('label_family_id'); ?></label>
<div class="col-md-6">
<input type="text" ng-model="newItem.customSelected2" typeahead="fm as fm.family_reg_no for fm in family | filter:{family_reg_no:$viewValue}" class="form-control" />
</div>
</div> …javascript twitter-bootstrap angularjs angular-ui angular-ui-bootstrap
我有一个AngularJS应用程序与Angular-UI模式.我想从控制器中检索模态HTML中定义的DOM元素,但它返回了undefined.
我在Plunker上传了我的代码(http://plnkr.co/edit/eoOuJiVaYASH1jMO8t2q?p=preview).
在ModalInstanceCtrl控制器中,如果我试图检索myElem模态模板中定义的元素,它给了我一个未定义的异常,如下所示,但如果我评论的话,效果很好var elem = $document.getElementById('myElem');.
TypeError: undefined is not a function
at new (http://run.plnkr.co/K8SndGsk5DANhGl2/:36:28)
at invoke (http://cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.20/angular.js:3918:17)
at Object.instantiate (http://cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.20/angular.js:3929:23)
at http://cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.20/angular.js:7216:28
at resolveSuccess (http://cdnjs.cloudflare.com/ajax/libs/angular-ui-bootstrap/0.10.0/ui-bootstrap-tpls.js:1710:32)
at wrappedCallback (http://cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.20/angular.js:11498:81)
at http://cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.20/angular.js:11584:26
at Scope.$eval (http://cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.20/angular.js:12608:28)
at Scope.$digest (http://cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.20/angular.js:12420:31)
at Scope.$apply (http://cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.20/angular.js:12712:24)
我在下面的代码中遗漏了什么？
谢谢,
当用户单击我的演示应用程序中仍在构建的内容时，我试图显示一个简单的模式。
一切正常，直到我希望用户单击模式上的“关闭”按钮。当他们这样做时，他们会得到：
类型错误：无法读取未定义的属性“解除”
这是我的主控制器中的内容：
$scope.underConstruction = function () {
var modalInstance = $modal.open({
templateUrl: 'app/shared/underconstruction.html',
controller: 'ModalInstanceCtrl',
size: 'sm',
resolve: {
'$modalInstance': function () { return function () { return modalInstance; } }
}
});
console.log('modal opened');
modalInstance.result.then(function (response) {
$scope.selected = response;
console.log(response);
}, function () {
console.log('Modal dismissed at: ' + new Date());
});
};
然后在我的 ModalInstanceCtrl 中我有：
app.controller('ModalInstanceCtrl', ['$scope', '$modal', function ($scope, $modal, $modalInstance) {
$scope.cancel = function () {
$modalInstance.dismiss('cancel');
};
}]);
我正在使用 Angular-UI 版本 0.12.0，AngularJS …
我正在使用angular-UI的Carousel,我想从我的控制器触发"prev"和"next"事件.
在Github上有关于它的问题,但它似乎没有实际处理:https://github.com/angular-ui/bootstrap/issues/1836
带有plunker示例的Carousel页面:http://angular-ui.github.io/bootstrap/
关于最佳方法的任何想法？谢谢!
javascript twitter-bootstrap angularjs angular-ui angular-ui-bootstrap
如何使用角度生成pdf？
我们使用高图表来生成图表，并且带有动态信息的图表我想生成pdf。
能告诉我一下方法吗？
<!DOCTYPE html>
<html>
<head>
<title>Page 1</title>
<style>
/* cyrillic-ext */
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 400;
src: local('Open Sans Regular'), local('OpenSans-Regular'), url(https://fonts.gstatic.com/s/opensans/v15/mem8YaGs126MiZpBA-UFWJ0bf8pkAp6a.woff2) format('woff2');
unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 400;
src: local('Open Sans Regular'), local('OpenSans-Regular'), url(https://fonts.gstatic.com/s/opensans/v15/mem8YaGs126MiZpBA-UFUZ0bf8pkAp6a.woff2) format('woff2');
unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek-ext */
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 400;
src: local('Open Sans Regular'), local('OpenSans-Regular'), url(https://fonts.gstatic.com/s/opensans/v15/mem8YaGs126MiZpBA-UFWZ0bf8pkAp6a.woff2) …我无法访问AngularJS控制器中的数组,但它在视图中工作.
在控制器中:.results返回undefined
function TwitterCtrl($scope, $resource){
$scope.twitter = $resource('http://search.twitter.com/:action',
{action:'search.json', q:'angularjs', callback:'JSON_CALLBACK'},
{get:{method:'JSONP', params: {rpp: 4}}});
$scope.twitterResult = $scope.twitter.get({q:"example"});
//returns the resource object
console.log($scope.twitterResult)
//returns undefined
console.log($scope.twitterResult.results);
}
在视图中:.results返回一组推文
//This returns an array of tweets
{{$scope.twitterResult.results}}
我想在AngularJS中使用一个指令,该指令应该允许0到1之间的十进制数.此外,它也可以允许"-1".
例如:-1有效0有效1有效0.12有效0.99有效1.01无效
如果您有任何建议,请告诉我.谢谢.
angularjs angular-ui angularjs-directive angularjs-scope angularjs-ng-repeat
我想知道什么是在控制器之间共享指令的好方法.我有两个指令在不同的控制器中使用不同的配置,我认为使用的第一个想法:
//html
<body data-ng-controller="MainCtrl">
<div class="container">
<div data-ui-view></div>
</div>
</body>
//js
.controller('MainCtrl', function ($scope,$upload) {
/*File upload config*/
$scope.onFileSelect = function($files) {
for (var i = 0; i < $files.length; i++) {
var file = $files[i];
$scope.upload = $upload.upload({
url: 'server/upload/url',
method: 'POST',
data: {myObj: $scope.myModelObj},
file: file,
}).progress(function(evt) {
console.log('percent: ' + parseInt(100.0 * evt.loaded / evt.total));
}).success(function(data, status, headers, config) {
console.log(data);
});
}
};
/* Datepicker config */
$scope.showWeeks = true;
$scope.minDate = new Date();
$scope.open = …angularjs angular-ui angularjs-directive angularjs-scope angular-ui-bootstrap
我发现很难想象为typeahead指令获取一组值的方法.
例如,在这个plunker中,http: //plnkr.co/edit/Sj0kOGipJ4gNv3VCnKzJ？p =preview
的index.html
<!doctype html>
<html ng-app="plunker">
<head>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.10/angular.js"></script>
<script src="//angular-ui.github.io/bootstrap/ui-bootstrap-tpls-0.11.0.js"></script>
<script src="example.js"></script>
<link href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css" rel="stylesheet">
</head>
<body>
<script type="text/ng-template" id="customTemplate.html">
<a>
<img ng-src="http://upload.wikimedia.org/wikipedia/commons/thumb/{{match.model.flag}}" width="16">
<span bind-html-unsafe="match.label | typeaheadHighlight:query"></span>
</a>
</script>
<div class='container-fluid' ng-controller="TypeaheadCtrl">
<h4>Static arrays</h4>
<pre>Model: {{selected | json}}</pre>
<input type="text" ng-model="selected" typeahead="state for state in states | filter:$viewValue | limitTo:8" class="form-control">
<h4>Asynchronous results</h4>
<pre>Model: {{asyncSelected | json}}</pre>
<input type="text" ng-model="asyncSelected" placeholder="Locations loaded via $http" typeahead="address for address in getLocation($viewValue)" typeahead-loading="loadingLocations" class="form-control">
<i ng-show="loadingLocations" class="glyphicon …angularjs angular-ui angular-ui-bootstrap angular-ui-typeahead
所以我有一些我无法控制的HTML.
<div id="myDiv">
Stuff inside my div...
</div>
我想添加一个ngClick到它.如果我可以控制html,我会这样做
<div id="myDiv" ng-click="doSomething()">
Stuff inside my div...
</div>
但就像我说的,我无法改变HTML.如果这是jQuery,我会这样做
$('#myDiv').click(function(){
doSomething();
});
我如何在Angularjs中做到这一点？谢谢.
UPDATE
从支票来看,似乎你们对我在这里要做的事情感到不满意,所以让我解释一下.
我在我的应用程序中使用AngularUI.AngularUI具有插入的所有这些模板.例如
<accordion-heading></accordion-heading>
变
<div class="panel-heading">
<h4 class="panel-title">
<a href="" class="accordion-toggle" ng-click="toggleOpen()" accordion-transclude="heading">
<span class="ng-binding ng-scope">Heading</span>
</a>
</h4>
</div>
我想将ngClick添加到"panel-title".我可以覆盖模板并添加它,但我不想这样做.来自jQuery,只需在"panel-title"上听一个click事件就有意义了.怎么做Angular？谢谢.