问题标签 [bootstrap-ui]
For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.
javascript - 比较 js 数组中的 1 个单词与 2 个单词的值
我正在使用带有 Bootstrap UI typeahead 的 Angular JS,并从 REST 服务中提取数据。数组中的项目包括我组合的城镇列表(服务的城镇),过滤掉重复项并创建了一个预先输入字段使用的“城镇列表”数组。一切都很好。
我需要帮助的问题是在搜索城镇/城市名称时,有些人使用相同的词(即贝德福德、新贝德福德、布鲁克菲尔德、西布鲁克菲尔德、东布鲁克菲尔德)当用户键入“贝德福德”时,“新”的结果贝德福德也出现了。
我想匹配 EXACT 数组值,并且仅在匹配时显示结果。因此,如果用户搜索 Bedford,结果中不会包含“New Bedford”(除非项目同时包含两个字符串)
我想知道是否有一种简单的方法可以解决这个问题,或者我是否需要包含一个自定义过滤器。
在对此进行故障排除时,我生成了导致问题的所有两个名称城镇的第二个数组......我不介意一个解决方案,我只需运行带有条件的自定义过滤器来检查查询字符串是否匹配。
angular - 如何使 bootstrap-ui datepicker 和 timepicker 内联?
有没有办法让 bootstrap-ui 组件显示为内联,如下所示:
我尝试了各种各样的东西,但我无法让它们全部对齐。这是Plunkr
更新:
已尝试将 uib-timepicker 标记从更改div
为span
,但这会破坏 datepicker 组件:https ://plnkr.co/edit/CjBzCthVyoQAVooi5oR7?p=preview
UPDATE2: 为了校准,这个问题是关于这个库的:https ://angular-ui.github.io/bootstrap/
UPDATE3: 用相对单位更新了接受答案中提供的plunkr: https ://plnkr.co/edit/TaoVJZwCjh1uLyz3huk9?p=preview
html - uib-pagination,限制可见页面按钮的最大数量
我非常成功地使用了 uib-pagination,但是我现在正在分页的数据非常庞大,事实证明页面数量非常大,所以我的末尾有大约 2800 多个按钮页。我需要以某种方式让用户有机会使用较少数量的按钮浏览页面。
假设我需要按钮为 [1][2][3][4][5][6][7][8][9][10] [Next 10 Pages] ... [Previuos 10 Pages] [2790][2791][2792][2793][2794][2795][2796][2797][2798][2799][2800]
这是html
这是我正在使用的组件:ui-bootstrap-tpls-1.0.3.js
我可以使用任何属性来实现这一点吗?
jquery - 所有屏幕的完整背景滑块,为较小的图像保持纵横比
我正在使用 HTML、CSS、jQuery、slick.js 滑块和 Bootstrap CSS 框架制作模板。
我想实现一个滑块,无论分辨率是多少,它都占据屏幕的 100% 宽度,并且在同一个滑块上,无论图像是宽长还是小,我都想保持图像的纵横比。
我保持了滑块图像的纵横比,但它没有占据全宽。
截图如下:
我希望该图像占据任何设备屏幕的全宽。
为此,它也必须将其覆盖到图像上看到的盒子上。
我的 HTML 代码是:
我的CSS代码是:
我的光滑滑块的 jQuery 是:
即使是小图像,图像也必须看起来很好且清晰。
如果有一些替代方式或任何其他选择或创造力,任何帮助将不胜感激。
css - 使用 angularjs ng repeat 和 bootstrap 类在框中显示产品,但显示方式错误
当产品在其他电子商务网站上显示时,我想在框中显示产品。
我正在使用 AngularJSng-repeat
和引导类,但它以错误的样式显示产品。
这是我的代码:
网站上所需的输出:
项目1 项目2 项目3 项目4
项目 5 项目 6 项目 7 项目 8 。. .
电流输出:
项目 1 项目 4 项目 6
项目 2 项目 5 项目 7
item3(无项目) item8
(无项目) - item9
angularjs - bootstrap-ui-datetime-picker 未在输入字段中显示预选日期
在我的应用程序中,我使用 bootstrap-ui-datetime-picker。我有两种情况,第一种是我第一次来并选择新的日期。在日期输入字段和日历中,我选择了今天的日期,这是正确且可以的。
在第二种情况下,当我从我的 API 日期数据中获取时,输入字段为空,但在日历中,我看到了正确的选定日期。
问题是,我需要在输入字段和日历弹出窗口中获取选定的日期,就像在第一种情况下一样。
这是我的代码...
这是我从 API 获取日期并将其设置为ng-model
. 从 API 我得到这样的格式(字符串)
使用 momentjs 我格式化日期并设置为 ng-model
angularjs - 用于动态图像的 Angular JS Bootstrap UI 模式
我尝试按照这个示例如何使用 angularJS 缩放图像 这是从 JSON 网站获取图像,并且每个 {} 有两个不同的图片链接。我正在尝试通过单击图片并打开模式来放大从我的模型中获得的缩略图。如何将模态绑定到我对图像的点击并传递图像和标题?顺便说一句,现在当模态打开时,它是空的并且宽度很小。它需要至少为 600X600。
angularjs - 打开嵌套模态并关闭当前(父)模态
从controller1
我打开一个这样的模式:
然后,我打开一个这样的嵌套模式:
但最后一部分:
...在嵌套模式中引发问题。在我的嵌套模式中没有任何作用:
如果我删除有问题的代码,嵌套模式可以正常工作。
如何关闭第一个模态而不使嵌套模态失败?
angularjs - 带有 UI Bootstrap 的 AngularJS - 单击导航项时自动折叠菜单
在此示例中: https ://plnkr.co/edit/O9fbLcTV7QPvqB3FpiAA?p=preview
当您单击汉堡菜单图标并选择一个导航项目时,它会保持菜单打开,直到您再次单击汉堡图标。选择菜单项时有自动折叠的好方法吗?
我试过了:
哪个有效,但在不处于移动模式(在更宽的屏幕上)时会触发导航菜单折叠动画。
javascript - Bootstrap ui 前瞻下拉菜单仅在先删除选择后才有效
我正在调试的软件使用ui-bootstrap-tpls-1.1.2。
默认情况下,如果我打开一个模式,然后单击其中一个具有前瞻下拉菜单的文本框,则会打开下拉菜单。
如果我然后从下拉列表中选择一个选项并再次单击该文本框以选择不同的选项,那么这次将不会打开下拉列表,除非我从原始选择中删除了至少一个字符。
无论是否已经选择了某些内容,每次单击文本框时如何打开该下拉菜单?
谢谢
我尝试过的事情:
不需要清除文本框,但我在文档中找不到任何可以在不清除文本“onclick”或“onfocus”的情况下提供另一种方法来完成此操作的内容。上面这两个函数都没有给出我希望的结果。
模态代码:
下面是模态的一个选择。
红色圆圈显示了一个已经做出选择的文本框。
如果我再次单击该文本框,则在我从“2017/18 项目”中删除至少一个字符之前,不会出现下拉菜单: