blocks|key|1373614|text|$location服务正在将url更改为：popup.html#/openModal|type|unstyled|depth|inlineStyleRanges|entityRanges|offset|length|data|1373615|但是JQuery+UI需要：popup.html#openModal|1373616|将$location服务配置为不使用hashbang模式：|1373617|angular.module('myApp',+[])
.config(function($locationProvider)+{
++++$locationProvider.html5Mode({
++++++enabled:+true,
++++++requireBase:+false
++++});
++++$locationProvider.hashPrefix('!');
})
.controller("alertController",+['$scope','$http','$sce',+'$location',++++++++
function($scope,$http,$sce,+$location)+{
++++$scope.data+=+"Hello+World";
}]);|code-block|syntax|javascript|1373618|"$location服务有两种配置模式，它们控制浏览器地址栏中URL的格式:+Hashbang模式(默认值)和基于使用HTML5历史API的HTML5模式。应用程序在这两种模式中使用相同的HTML5，$location服务将与适当的URL段和浏览器API一起工作，以促进浏览器URL的更改和历史管理。“|1373619|https://code.angularjs.org/1.2.25/docs/guide/$location|1373620|或者，如果您不需要位置服务，只需从应用程序中删除$location：|1373621|angular.module('myApp',[])
.controller("alertController",+['$scope','$http','$sce',+function+($scope,$http,$sce)+{
++++$scope.data+=+"Hello+World";
}]);|1373622|更多信息在这里：https://code.angularjs.org/1.2.25/docs/guide/$location|1373623|将超链接从href更改为ng-href：|1373624|<a+ng-href="#close"+title="Close"+class="close">X</a>
<a+ng-href="#openModal">Create+Alert</a>|1373625|entityMap|0|LINK|mutability|MUTABLE|url|http://www.gamengai.com/bad_popup.html#/openModal|1|http://www.gamengai.com/bad_popup.html#openModal|2|https://code.angularjs.org/1.2.25/docs/guide/|3^0|L|L|0|0|E|K|1|0|0|0|0|0|19|2|0|0|0|8|19|3|0|0|0^^$0|@$1|2|3|4|5|6|7|1D|8|@]|9|@$A|1E|B|1F|1|1G]]|C|$]]|$1|D|3|E|5|6|7|1H|8|@]|9|@$A|1I|B|1J|1|1K]]|C|$]]|$1|F|3|G|5|6|7|1L|8|@]|9|@]|C|$]]|$1|H|3|I|5|J|7|1M|8|@]|9|@]|C|$K|L]]|$1|M|3|N|5|6|7|1N|8|@]|9|@]|C|$]]|$1|O|3|P|5|6|7|1O|8|@]|9|@$A|1P|B|1Q|1|1R]]|C|$]]|$1|Q|3|R|5|6|7|1S|8|@]|9|@]|C|$]]|$1|S|3|T|5|J|7|1T|8|@]|9|@]|C|$K|L]]|$1|U|3|V|5|6|7|1U|8|@]|9|@$A|1V|B|1W|1|1X]]|C|$]]|$1|W|3|X|5|6|7|1Y|8|@]|9|@]|C|$]]|$1|Y|3|Z|5|J|7|1Z|8|@]|9|@]|C|$K|L]]|$1|10|3|-4|5|6|7|20|8|@]|9|@]|C|$]]]|11|$12|$5|13|14|15|C|$16|17]]|18|$5|13|14|15|C|$16|19]]|1A|$5|13|14|15|C|$16|1B]]|1C|$5|13|14|15|C|$16|1B]]]]

the $location service is changing the url to:
<a href="http://www.gamengai.com/bad_popup.html#/openModal" rel="nofollow">http://www.gamengai.com/bad_popup.html#/openModal</a>

But JQuery UI needs:
<a href="http://www.gamengai.com/bad_popup.html#openModal" rel="nofollow">http://www.gamengai.com/bad_popup.html#openModal</a>

Configure the $location service to not use the hashbang mode:

<pre><code>angular.module('myApp', [])
.config(function($locationProvider) {
 $locationProvider.html5Mode({
 enabled: true,
 requireBase: false
 });
 $locationProvider.hashPrefix('!');
})
.controller("alertController", ['$scope','$http','$sce', '$location', 
function($scope,$http,$sce, $location) {
 $scope.data = "Hello World";
}]);
</code></pre>

"$location service has two configuration modes which control the format of the URL in the browser address bar: Hashbang mode (the default) and the HTML5 mode which is based on using the HTML5 History API. Applications use the same API in both modes and the $location service will work with appropriate URL segments and browser APIs to facilitate the browser URL change and history management."

<a href="https://code.angularjs.org/1.2.25/docs/guide/" rel="nofollow">https://code.angularjs.org/1.2.25/docs/guide/</a>$location

Or if you don't need the location service, you could simply remove $location from your app:

<pre><code>angular.module('myApp',[])
.controller("alertController", ['$scope','$http','$sce', function ($scope,$http,$sce) {
 $scope.data = "Hello World";
}]);
</code></pre>

More info here:
<a href="https://code.angularjs.org/1.2.25/docs/guide/" rel="nofollow">https://code.angularjs.org/1.2.25/docs/guide/</a>$location

Change the hyperlinks from href to ng-href:

<pre><code>&lt;a ng-href="#close" title="Close" class="close"&gt;X&lt;/a&gt;
&lt;a ng-href="#openModal"&gt;Create Alert&lt;/a&gt;
</code></pre>

This is driving me nuts. I fumbled around with converting a site to AngularJS about a year ago. I got it to a livable state, although a bit tacky. I'm trying to add a new page, which will use a modal dialog. I have code with modal dialogs that work. This one, for some reason, does not. I'm finding the lack of debugging info in the console highly irritating. Anywho, I'm hoping I'm just overlooking something. I have cut the guts of the controller out... and the HTML for that fact as none of it is required for this.

Symptom: I hit "Create Alert" and nothing happens. You can see the page itself <a href="http://www.gamengai.com/bad_popup.html" rel="nofollow">here</a>.

<pre><code>&lt;script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.25/angular-sanitize.min.js"&gt;&lt;/script&gt;
&lt;script&gt;

angular.module('myApp', ['ngSanitize'])
.controller("alertController", ['$scope','$http','$sce','$location', function($scope,$http,$sce,$location) {
 $scope.data = "Hello World";
}]);

&lt;/script&gt;
&lt;/head&gt;
&lt;body&gt;

&lt;div class="parent_column" style="min-width: 700px; max-width: 700px; margin: 50px auto;" data-ng-app="myApp" data-ng-controller="alertController"&gt;
{{data}}
 &lt;span id="openModal" class="modalDialog" style="padding: 3px;"&gt;
 &lt;div style="width: 250px;"&gt;
 Modal!
 &lt;a href="#close" title="Close" class="close"&gt;X&lt;/a&gt;
 &lt;/div&gt;
 &lt;/span&gt;

 &lt;div class="ggButton" style="line-height: 135%;"&gt;&lt;a href="#openModal"&gt;Create Alert&lt;/a&gt;&lt;/div&gt;

&lt;/div&gt;
</code></pre>

AngularJS modal dialog not opening

翻译质量差，导致语言生硬或混乱。

没有提供实际的解决方法或示例。

解答不清晰，无法理解或解决问题。

页面排版不美观，阅读体验差。

文章

问答

视频

学习中心

腾讯云实验室

直播

竞赛

腾讯云代码分析专区

腾讯iOA零信任安全管理系统专区

腾讯云架构师技术同盟交流圈

腾讯云数据库专区

腾讯云顾问专区

腾讯云原生专区

腾讯混元专区

腾讯云TCE专区

腾讯云Lighthouse专区

腾讯云HAI专区

腾讯云Edgeone专区

腾讯云存储专区

腾讯云智能专区

腾讯轻联专区 

腾讯云开发专区

TAPD专区

腾讯轻量云游戏服专区

腾讯云最具价值专家

腾讯云架构师技术同盟

腾讯云创作之星

腾讯云开发者先锋

腾讯云代码助手

云原生构建

TAPD 敏捷项目管理

Cloud Studio

SDK中心

API中心

命令行工具

涵盖代码开发、场景应用、自动测试全流程，助你从零构建专属AI助手

一站式MCP教程库，解锁AI应用新玩法

快把我逼疯了。大约一年前，我摸索着将一个站点转换为AngularJS。我把它带到了一个宜居的状态，虽然有点俗气。我正在尝试添加一个新的页面，它将使用一个模态对话框。我有能工作的模态对话框的代码。这个，由于某种原因，没有。我发现控制台中缺少调试信息非常令人恼火。不管怎么说，我希望我只是忽略了一些东西。我切掉了控制器的内脏...

AngularJS模态对话框未打开-腾讯云开发者社区-腾讯云

问AngularJS模态对话框未打开
EN

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问AngularJS模态对话框未打开EN

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问AngularJS模态对话框未打开
EN