试图让印刷适用于Modals.
在最新的谷歌浏览器中,使用最新的angular-ui-bootstrap 0.14.2,我们在列表或表格等大型内容溢出到下一页时遇到问题.
我已经完成了隐藏背景对象的必要更改:将以下样式添加到模式页面中:
@media print {
body * {
visibility: hidden;
}
#print-content * {
visibility: visible;
overflow: visible;
}
#mainPage * {
display: none;
}
.modal {
position: absolute;
left: 0;
top: 0;
margin: 0;
padding: 0;
min-height: 550px;
}
li {
page-break-after: auto;
}
}
任何人都有快速解决方案吗？
Plunker:http://plnkr.co/edit/TV0ttEAw4LWJ6sGLjSTR？p = preview
您可以测试不同模态的打印预览和打印按钮.打印预览适用于当前页面,但不适用于模态.=(
自从我将项目更新为"angular-bootstrap": "~1.2.4",我在控制台中发出警告:
uib-datepicker settings via uib-datepicker-popup attributes are deprecated and will be removed in UI Bootstrap 1.3, use datepicker-options attribute instead
uib-datepicker-popup 由日期格式或日期格式数组填充:
uib-datepicker-popup="dd-MMMM-yyyy" 在我的情况下因此,在角度引导程序文档中,仍然显示了deprecated处理此案例的方法.
有谁知道如何迁移到新版本？
我正在使用来自Angular Bootstrap的typeahead - https://ng-bootstrap.github.io/#/components/typeahead/examples
一切正常,但我希望在一个文本框上有多个值.由于该字段是来自组,一旦选择了一个值,它就可以允许下一个,而不删除前一个.
我想显示一个模态框,询问用户是否要删除帖子.我无法弄清楚如何传递我在密钥参数中传递的密钥,我也可以在其中发出警报.
我从角度twitterbootstrap网站获取代码,但我无法找出传递数据以确认删除的方法.
谢谢穆罕默德
$scope.deletePost = function(key, post, event) {
alert(key);
var modalInstance = $modal.open({
templateUrl: 'deletePost.html',
controller: ModalInstanceCtrl,
resolve: {
items: function() {
return $scope.posts;
}
},
})
modalInstance.result.then(function(selectedItem) {
$scope.selected = selectedItem;
alert(selectedItem);
});
};
var ModalInstanceCtrl = function($scope, $modalInstance, items) {
$scope.items = items;
$scope.selected = {
item: $scope.items[0]
};
$scope.ok = function() {
$modalInstance.close($scope.selected.item);
};
$scope.cancel = function() {
$modalInstance.dismiss('cancel');
};
};
我有一个工作的AngularJS应用程序,并开始使用RequireJS进行模块依赖.遵循本指南 - http://www.startersquad.com/blog/angularjs-requirejs/ - 使用domReady插件手动启动角度应用程序.
在Chrome中测试并进入Uncaught object控制台.没有角度通常提供的通常细节,只有无用的调用堆栈.
这是我的应用程序的一个非常简化的版本:
<html ng-app="myApp">
<body>
<script data-main="/scripts/config.js" src="scripts/require.js"></script>
</body>
</html>
config.js:
requirejs.config({
shim: { 'angular': { exports: 'angular' } },
deps: ['starting']
});
define(['require', 'angular', 'app'], function (require, angular) {
require(['domReady!'], function (document) {
angular.bootstrap(document, ['myApp']);
});
});
app.js:
define(['angular'], function (angular) {
var app = angular.module("myApp", []);
return app;
});
我开始使用MEAN.JS并尝试在Angular Bootstrap示例页面上实现轮播示例.我使用命令yo meanjs创建了一个样板项目,并修改了home.client.view.html以删除jumbotron并将其替换为以下html(从ui bootstrap示例中复制)
<div ng-controller="MyCarouselController">
<div style="height: 305px">
<carousel interval="myInterval">
<slide ng-repeat="slide in slides" active="slide.active">
<img ng-src="{{slide.image}}" style="margin:auto;">
<div class="carousel-caption">
<h4>Slide {{$index}}</h4>
<p>{{slide.text}}</p>
</div>
</slide>
</carousel>
</div>
<div class="row">
<div class="col-md-6">
<button type="button" class="btn btn-info" ng-click="addSlide()">Add Slide</button>
</div>
<div class="col-md-6">
Interval, in milliseconds: <input type="number" class="form-control" ng-model="myInterval">
<br />Enter a negative number to stop the interval.
</div>
</div>
</div>
我添加了一个名为MyCarouselController的控制器(文件名为carousel.client.controller.js)并从示例中添加了javascript
angular.module('core').controller('MyCarouselController', ['$scope', 'Authentication',
function($scope, Authentication) {
$scope.myInterval = 5000;
var slides …我正在使用Yeoman和cg-angular生成器来构建一个角度应用程序.这最初工作正常,但我最近升级angular-bootstrap,从0.10以0.11获得关于模态大小的一个新功能的保持.执行此操作后,我注意到Chrome上的开发人员控制台中出现以下错误.
GET http://localhost:9001/fonts/glyphicons-halflings-regular.woff angular-ui-router.js:3702
GET http://localhost:9001/fonts/glyphicons-halflings-regular.ttf :9001/fonts/glyphicons-halflings-regular.ttf:1
我使用的版本3.1.1的bootstrap.
如果我升级bootstrap到最新的那个3.3.4.然后我得到一些不同的错误:
GET http://fonts/glyphicons-halflings-regular.woff2 net::ERR_NAME_NOT_RESOLVED angular-animate.js:442
GET http://fonts/glyphicons-halflings-regular.woff net::ERR_NAME_NOT_RESOLVED fonts/glyphicons-halflings-regular.woff:1
GET http://fonts/glyphicons-halflings-regular.ttf net::ERR_NAME_NOT_RESOLVED fonts/glyphicons-halflings-regular.ttf:1
我应该说我在本地运行时看到这些错误 grunt serve
此外,如果我升级boostrap,但保持angular-bootstrap在0.10那时我没有这些问题.
我也有以下我的Gruntfile.js:
copy: {
main: {
files: [
{src: ['bower_components/font-awesome/fonts/**'], dest: 'dist/', filter: 'isFile', expand: true},
{src: ['bower_components/bootstrap/fonts/**'], dest: 'dist/', filter: 'isFile', expand: true}
]
}
}
虽然,就像我说的那样,我在本地运行时看到这些丢失的字形,所以这个笨拙的任务不应该进入游戏.
我已经仔细研究了angular-bootstrap代码,令人困惑的是,代码中似乎没有直接引用glyphicon字体,因此升级此模块可能会导致这些错误有点奇怪.
升级时有没有其他人对glyphicons有任何问题angular-bootstrap？
无论显示内容的大小如何，我如何都可以将该模式窗口垂直居中。在我的页面中，我将图像显示为模式窗口，并且希望将其显示在屏幕中央。我可以水平对齐，但不能使其垂直协作。有什么想法/例子吗？
我在页面中遵循以下示例：模态窗口演示插件
但模态窗口的实际内容如下所示：
<script type="text/ng-template" id="myModalContent.html">
<div>
<img class= "attachmentImage" src={{items}} />
</div>
</script>
我应该寻找使的变化bootstrap.min.css或者ui-bootstrap-tpls-0.13.0.js或者是在我自己的表与我的风格接近这一目标的最佳途径。
非常感谢您的宝贵时间。如果您需要更多信息或不清楚，请告诉我。
css twitter-bootstrap angularjs bootstrap-modal angular-bootstrap
即使在我使用它之后它仍然显示箭头
<div uib-timepicker ng-model="mytime" arrowkeys="false" show-meridian="false"></div>
以下是plunker:https://plnkr.co/edit/j5JlXWsoldsj0iEdSUMY ? p = preview
如何禁用它们？有谁知道？他们的文档说明可以隐藏箭头.这是一个错误吗？
Angular Bootstrap timepicker插件:链接
谢谢
有没有办法防止AngularJS模态在模态的控制器逻辑中关闭/解除？
我想要的是当用户关闭模态时显示警告,并且模态内的表单包含未保存的数据.
我已经尝试过搜索一个关闭之前的事件或者我可以在官方文档中使用的其他东西,但到目前为止还没有运气.
angularjs ×8
angular ×1
angular-ui ×1
css ×1
datepicker ×1
domready ×1
firebase ×1
glyphicons ×1
javascript ×1
mean-stack ×1
ng-bootstrap ×1
requirejs ×1