angularjs 相关问题

我想创建引导下拉列表而不使用jquery 我想创建引导下拉列表而不使用jquery <div class="dropdown"> <button class="btn btn-primary dropdown-toggle" type="button" data-toggle="dropdown"> Dropdown <span class="caret"></span> </button> <ul class="dropdown-menu"> <li><a href="#">HTML</a></li> <li><a href="#">CSS</a></li> <li><a href="#">JavaScript</a></li> </ul> </div> 请帮助如何做到这一点记住将 ui-bootstrap 指令添加到 angular.module HTML代码 <ul uib-dropdown-menu role="menu" aria-labelledby="btn-append-to-body"> <li role="menuitem"><a href="#">Action</a></li> <li role="menuitem"><a href="#">Another action</a></li> <li role="menuitem"><a href="#">Something else here</a></li> <li class="divider"></li> <li role="menuitem"><a href="#">Separated link</a></li> </ul> Js代码 angular.module('ui.bootstrap.demo').controller('DropdownCtrl', function ($scope, $log) { $scope.items = [ 'The first choice!', 'And another choice for you.', 'but wait! A third!' ]; $scope.status = { isopen: false }; $scope.toggled = function(open) { $log.log('Dropdown is now: ', open); }; $scope.toggleDropdown = function($event) { $event.preventDefault(); $event.stopPropagation(); $scope.status.isopen = !$scope.status.isopen; }; $scope.appendToEl = angular.element(document.querySelector('#dropdown-long- content')); }); 我写了我的下拉菜单脚本，没有Jquery，没有Bootstrap js，只有bootstrap css，无论如何都很容易覆盖： document.addEventListener('DOMContentLoaded', function () { // -----Dropdown---------- // Rule: link.dropdown-link data-dropdown='dropdownIdentifier' div#dropdownIdentifier let dropdowns = document.querySelectorAll('.dropdown-link'); for (dropdown of dropdowns) { dropdown.onclick = function (e) { let dropdownDiv = document.getElementById(dropdown.getAttribute('data-dropdown')) if (dropdownDiv.style.display == "block") { dropdownDiv.style.display = "none"; } else { dropdownDiv.style.display = "block"; } } } }); 现在是 html 格式： <a class="dropdown-link" data-dropdown="dropdownId">Prodbox</a> <div id="dropdownId" class="dropdown-menu"> 1 2 3 </div> 请注意，下拉菜单是引导类来设置其样式，如果您不使用引导CSS，您可以编写自己的在通过 webpack 捆绑的 Bootstrap 5 中，您可以通过创建新的 Dropdown 实例来实现。示例： import Dropdown from 'bootstrap/js/dist/dropdown'; const dropdownEl = document.getElementById('dropdown'); new Dropdown(dropdownEl /*, options*/); 有关选项的详细信息文档。

angularjs angular-ui-bootstrap

回答 3 投票 0

JS 函数声明不应该放在块中

我已将 95% 的“parentCtrl”（控制器）封装在“IF”语句中，这可以防止在用户未登录和授权的情况下触发任何功能。自从这样做以来，我不断...

javascript angularjs function jshint javascript-function-declaration

回答 1 投票 0

asp.net web api 中的会话管理？

我知道asp.net中的“会话”。我曾经在需要时将用户数据和所需信息存储到会话中。（但我不知道如何使会话超时等等。只是为了在服务器上存储数据

angularjs asp.net-mvc-4 session asp.net-web-api session-timeout

回答 1 投票 0

以编程方式更改模型时，选择框不会更新

我在弹出窗口中有一个选择框，我可以毫无问题地分配初始值。但是，我想在打开弹出窗口时更改选择框的值，但问题是虽然它“勾选”了

angularjs jquery-mobile drop-down-menu jquery-mobile-popup

回答 2 投票 0

为什么我的范围未定义？

我有以下html：我正在尝试获得如下范围： console.log("应用程序元素范围：" + $('#angularHeaderDiv').scope()); 但我收到：未定义。我是 angularJS 初学者，我很简单...

jquery html angularjs

回答 3 投票 0

在 Angular 中的 PrimeNg 中自定义 TabMenu 或 TabView

说明：我目前正在开发一个项目，我需要在 PrimeNg 中重新创建像 TabMenu/TabView 这样的小部件，但我在每个按钮上使用不同的路由器链接和自定义时遇到了麻烦...

javascript angular angularjs typescript primeng

回答 1 投票 0

显示：无！重要注入<img ng-src...>

我正在尝试调试我的 AngularJS 应用程序，其中 display:none 被注入到标签中，如下所示：这是 img 标签的显示方式：我正在尝试调试我的 AngularJS 应用程序，其中 display:none 被注入到标签中，如下所示：这就是 img 标签的显示方式： <img ng-src="{{clientImage}}" style="margin: 0 0 0 5px;" /> 这就是我得到的： <img ng-src="{{clientImage}}" style="margin: 0 0 0 5px; display: none !important;" /> 有人可以帮助我建议如何跟踪 (display: none !important;) 是如何注入的吗？还有什么想法可能会在我的 img 标签中注入这个？注意事项： - 这个问题仅发生在某些浏览器上，但不是所有浏览器上，实际上我已经尝试在同一浏览器版本上但在两台不同的计算机上重现该错误，但失败了。 - 我正在使用 Chrome 最新版本进行测试关闭广告拦截。我有一张名为“Advert.png”的图片，花了太多时间才意识到广告块正在阻止它 ØØ。当浏览器中使用广告拦截器扩展时，会出现此问题，当您暂停时，您将能够看到图像，并且不会显示此内联 CSS。我也有类似的情况。这是因为我在 Chrome 上安装了广告拦截器。我的应用程序在没有安装广告拦截器的 Firefox 上运行良好。但chrome没有显示元素。经过几个小时的谷歌搜索后，我发现 chrome 未显示的元素 id 是问题所在。我对特定元素的 ID 是“广告后”。我将其更改为“新建”。就是这样。它开始工作了:) 我认为广告拦截器会找到html页面的某些ID和名称来决定是否显示它。希望这对某人有帮助我在从 src attrib 加载图像时发生了这种情况，为某些图像添加了内联样式"style="display: none !important;"。尝试禁用 Chrome 中的 Angular Inspector 插件。我在正常模式下发生过这种情况，但在隐身模式、firefox、opera、mobile 下一切正常。首先，检查 DevTools 是否显示哪个 CSS 规则隐藏了它。它应该为您提供文件和行。如果不是，请尝试禁用 Javascript，看看是否有帮助。或者手动扫描文件并查找 .hide()、.toggle() 等（如果使用 jQuery）。要进一步调试，您可以尝试通过选择元素在子树和属性修改上设置断点，然后在上下文菜单中选择“Break on...”（如下所示）。您也可以尝试视觉事件。另请参阅：如何在 DOM 节点上查找事件侦听器？补充一下，可能不仅仅是 Adblock。任何操纵浏览器 DOM 的扩展程序（例如第三方夜间模式扩展程序）都可能是罪魁祸首。我所做的就是禁用所有扩展，然后慢慢地一一启用它们以找到罪魁祸首。

angularjs google-chrome-devtools

回答 6 投票 0

为什么 $scope >= 0 在插值中显示 true，而在控制器中显示为空？

我根据成功的操作将 $scope 变量设置为 0 或 1，并使用 ng-show 显示元素。该步骤完成后，我将 $scope 变量重置为空。然而，我发现...

angularjs boolean angularjs-scope logical-operators

回答 1 投票 0

将对象的键值对作为单独的参数传递给 Angular 中的组件

假设我有一个组件，它接受三个输入 input1、input2 和 input3 导出类测试组件{ @Input() 输入1：字符串； @Input() 输入2：字符串； @Input() 输入3：字符串； .... ... }...

angular angularjs typescript frontend angular-components

回答 1 投票 0

Angular：将动态创建的组件添加为目标元素的子级

我正在实现一个指令，将操作添加到 mat-table 的 mat-cell 中： &l...