angularjs 相关问题

用于关于开源JavaScript框架AngularJS(1.x)的问题。不要将此标记用于Angular 2或更高版本;相反,使用[angular]标签。

AngularJs jQuery:动态添加 HTML

我正在尝试将行和列动态添加到 HTML 表格中,列标题上有一个按钮,该按钮会通过 angularJs ng 单击弹出一条警报消息。 我的列和行已正确添加

回答 3 投票 0

NPM Start 无法工作(无法让 Node 在 Mac OS X Yosemite 上工作)

我是一名 Rails 人员,但我正在尝试学习一些 Angular JS。我想完成本教程,但我什至无法让节点服务器开始运行。 下面是 npm-debug.log 文件 0 信息...

回答 1 投票 0

如何在anguler1,Bootstrap3中添加多选复选框下拉列表

我是angulerJS的新手,所以不知道如何添加多选复选框下拉列表。 这是我的部分 html,显示多选。我希望它呈带有复选框的下拉菜单形状,如图所示...

回答 1 投票 0

前端或后端的api错误消息国际化?

我的团队目前正在做一个Web项目,前端使用后端提供的json api。我们使用的技术是 Spring Boot 和 AngularJS。 api 有标准错误...

回答 3 投票 0

BPNM 库 Angular 动态 CSS

我正在使用 Bpmn 库来绘制图表。 我需要在图表视图上隐藏这个调色板...... 所以在 TypeScript 文件中,我为该元素做了一个 @viewChild 并尝试动态添加 css 来隐藏它。 ...

回答 1 投票 0

PDF Blob - 弹出窗口不显示内容

过去几天我一直在解决这个问题。由于尝试在 标签上显示流没有成功,我只是尝试在新窗口上显示它。 新窗口显示 PDF

回答 11 投票 0

找到并清除吐司(Toastr)

我有一个页面,其中可能有使用插件 https://github.com/CodeSeven/toastr 动态添加的多个 toast。 我在每个吐司上都有一个链接(好的),单击该链接时我只需关闭...

回答 5 投票 0

Yii2 REST+ Angular 跨域 CORS

我开发了 Angular 和 Yii2 REST 服务。跨域有问题。 下面添加我的 Angular 和 Yii2 REST 代码。 AngularJs :(如“http://organization1.example.com”、“http://

回答 3 投票 0

由于版本不匹配,无法运行 Angular 解决方案

尝试通过 VS Code 运行角度解决方案时,出现以下错误。 此版本的 CLI 仅与 Angular 版本 ^18.0.0 兼容, 但 Angular 版本 13.3.12 被发现于...

回答 3 投票 0

多次解决承诺是否安全?

我的应用程序中有一个 i18n 服务,其中包含以下代码: var i18nService = 函数() { this.ensureLocaleIsLoaded = function() { if(!this.existingPromise) { 这个。

回答 8 投票 0

等到scrollTo完成后再运行命令

我有一个 AngularJS 应用程序,并且有一个平滑滚动指令来强制页面滚动到底部。我希望该命令仅在滚动完成后运行。您可以在

回答 5 投票 0

由于版本不匹配而无法运行 ANGULAR 解决方案

尝试通过 VS Code 运行角度解决方案时,出现以下错误。 此版本的 CLI 仅与 Angular 版本 ^18.0.0 兼容, 但发现 Angular 版本 13.3.12...

回答 1 投票 0

类型“未知”不可分配给类型“HttpEvent<any>” - 尝试在 Angular 应用程序中创建 HTTP 拦截器

我一直在尝试在我的 Angular 应用程序中创建一个加载微调器。 我在这里找到了一个有趣的教程(https://medium.com/swlh/angular-loading-spinner-using-http-interceptor-63c1bb76517b)....

回答 1 投票 0

如何将 HTML 文本创建为 DOM 对象

我有一个应用程序,其中页面生成器创建一个保存在数据库中的起始页面。保存的信息只是DOM对象的outerHTML。要创建编辑功能,我需要一个逆

回答 3 投票 0

如何美化在 AngularJS 中作为字符串返回的 XML

我的 HTML 如下所示,从 Angular 返回一些内容(我的角度代码如下) {{xml}} 在 Angular 中,从 Java 后端,我得到...

回答 2 投票 0

UI 网格获取所选行的索引

我想要 ui-grid 中所选行的索引/索引值。我尝试使用 onRowSelectionChange 事件获取它,但我无法做到。 我该如何获取所选行的索引?

回答 2 投票 0

inject() 必须从单元测试中的注入上下文中调用

当我一开始尝试在测试文件中使用 AlertsComponent 时,它需要一些服务。添加这些服务后出现以下错误: ject() 必须从注入中调用...

回答 1 投票 0

将 Excel 转换为内存流并通过 AngularJS 下载

我想在 C# 中动态创建一个 Excel 文件,并且我需要将其设置为可在 AngularJS HTML Button Click 中下载。 我参考了以下链接来动态创建Excel http://www.increvcor...

回答 1 投票 0

Angular Material 选项卡内的 Fabricjs 画布不起作用

我一直在尝试在角度材料选项卡(material.angularjs.org/latest/demo/tabs)内使用 Fabric.canvas 但这似乎不起作用。 最后我希望有多个带有多个

回答 3 投票 0

如何在不刷新页面的情况下更新角度数据?

我在数据库表中有一些数据,我使用角度来显示它。我使用页脚中的以下脚本来执行此操作: var app = angular.module('企业'...</desc> <question vote="1"> <p>我在数据库表中有一些数据,我使用角度来显示它。我使用页脚中的以下脚本<em>来执行此操作:</em> </p><code> &lt;script !src=&#34;&#34;&gt; var app = angular.module(&#39;enterprise&#39;, []); app.controller(&#39;entercontroller&#39;, function($scope, $http){ $scope.loadData= function(){ $http.post(&#39;&lt;?php echo base_url(); ?&gt;Groups_/load_data&#39;) .then(function(mydata){ console.log(mydata); $scope.datas = mydata.data; }); }; $scope.loadData(); }); &lt;/script&gt; </code><pre> </pre>我的控制器中的 load_data() 函数如下:<p> </p><code> public function load_data(){ $data[&#34;groups&#34;] = $this-&gt;Groups-&gt;fetch_groups(); return $this-&gt;output -&gt;set_status_header(200) -&gt;set_content_type(&#39;application/json&#39;, &#39;utf-8&#39;) -&gt;set_output(json_encode($data[&#34;groups&#34;], JSON_PRETTY_PRINT | JSON_UNESCAPED_UNICODE | JSON_UNESCAPED_SLASHES)); } </code><pre> </pre>我的观点是一些带有提交按钮的输入。我需要的是,当我单击按钮添加新记录时,表会自动更新,而无需每次刷新页面。所以我制作了另一个脚本来做到这一点<p> </p><code> &lt;script&gt; $(document).ready(function() { $(&#39;#add&#39;).on(&#39;submit&#39;, function() { var that = $(this); $dataString = that.serialize(); $.ajax({ url: &#39;&lt;?php echo base_url(); ?&gt;&#39;+ $(&#34;#uri&#34;).val() , type: &#39;POST&#39;, dataType: &#39;json&#39;, cache:false, data : $dataString, success: function (data) { console.log(data); $(&#39;#message&#39;).html(data[&#39;message&#39;]); $(&#39;:input&#39;,&#39;#add&#39;) .removeAttr(&#39;checked&#39;) .removeAttr(&#39;selected&#39;) .not(&#39;:button, :submit, :reset, :hidden, :radio, :checkbox&#39;) .val(&#39;&#39;); }, error: function (data) { console.log(&#39;error&#39;); console.log(data); } }); return false; }); }); &lt;/script&gt; </code><pre> </pre>HTML 代码如下:<p> </p><code>&lt;div class=&#34;page-wrapper&#34; ng-app=&#34;enterprise&#34; ng-controller=&#34;entercontroller&#34;&gt; &lt;div class=&#34;container-fluid&#34;&gt; &lt;div class=&#34;row&#34;&gt; &lt;div class=&#34;col-12&#34;&gt; &lt;div class=&#34;card&#34;&gt; &lt;div class=&#34;card-block&#34;&gt; &lt;form class=&#34;floating-labels m-t-40&#34; method=&#34;post&#34; id=&#34;add&#34; action=&#34;addgroup&#34;&gt; &lt;div class=&#34;form-group m-b-40&#34;&gt; &lt;input type=&#34;text&#34; name=&#34;group_title&#34; class=&#34;form-control input-lg&#34; id=&#34;input8&#34; required&gt;&lt;span class=&#34;bar&#34;&gt;&lt;/span&gt; &lt;label for=&#34;input8&#34;&gt;Group Name&lt;/label&gt;&lt;br /&gt; &lt;/div&gt; &lt;div class=&#34;form-group m-b-40&#34;&gt; &lt;input type=&#34;text&#34; name=&#34;group_link&#34; class=&#34;form-control input-lg&#34; id=&#34;input7&#34; required&gt;&lt;span class=&#34;bar&#34;&gt;&lt;/span&gt; &lt;label for=&#34;input7&#34;&gt;Link&lt;/label&gt; &lt;/div&gt; &lt;div class=&#34;form-group m-b-40&#34;&gt; &lt;select name=&#34;group_icon_code&#34; class=&#34;custom-select form-control&#34; id=&#34;location1&#34; required &gt; &lt;option value=&#34;&#34;&gt;Icon&lt;/option&gt; &lt;?php if(isset($icons)) foreach($icons as $icon) echo &#39;&lt;option value=&#34;&#39;.$icon-&gt;icon_value.&#39;&#34;&gt;&#39;.$icon-&gt;icon_name.&#39;&lt;/option&gt;&#39;; ?&gt; &lt;/select&gt; &lt;/div&gt; &lt;div class=&#34;text-xs-right&#34;&gt; &lt;input type=&#34;hidden&#34; id=&#34;uri&#34; name=&#34;uri&#34; value=&#34;Groups_/addgroup&#34; /&gt; &lt;button type=&#34;submit&#34; ng-click=&#34;loadData()&#34; name=&#34;add&#34; value=&#34;1&#34; class=&#34;btn btn-success&#34;&gt; &lt;i class=&#34;fa fa-check&#34;&gt;&lt;/i&gt; save&lt;/button&gt; &lt;button type=&#34;reset&#34; class=&#34;btn btn-inverse&#34;&gt; &lt;i class=&#34;fa fa-times&#34;&gt;&lt;/i&gt; cancel&lt;/button&gt; &lt;/div&gt; &lt;/form&gt; &lt;/div&gt; &lt;/div&gt; &lt;/div&gt; &lt;/div&gt; &lt;div class=&#34;row&#34;&gt; &lt;div class=&#34;col-12&#34;&gt; &lt;div class=&#34;card&#34;&gt; &lt;div class=&#34;card-block&#34;&gt; &lt;div class=&#34;table-responsive&#34;&gt; &lt;table class=&#34;table color-bordered-table inverse-bordered-table&#34;&gt; &lt;thead&gt; &lt;tr&gt; &lt;th&gt;title&lt;/th&gt; &lt;th&gt;link&lt;/th&gt; &lt;th&gt;order&lt;/th&gt; &lt;th&gt;icon&lt;/th&gt; &lt;th class=&#34;text-nowrap&#34;&gt;control&lt;/th&gt; &lt;/tr&gt; &lt;/thead&gt; &lt;tbody&gt; &lt;tr ng-repeat=&#34;d in datas&#34;&gt; &lt;td&gt;{{ d.group_title }}&lt;/td&gt; &lt;td&gt;{{ d.group_link }}&lt;/td&gt; &lt;td&gt;{{ d.group_order }}&lt;/td&gt; &lt;td&gt;&lt;i class=&#34;mdi {{ d.group_icon_code }}&#34;&gt;&lt;/i&gt;&lt;/td&gt; &lt;td class=&#34;text-nowrap&#34;&gt; &lt;a href=&#34;#&#34; data-toggle=&#34;tooltip&#34; data-original-title=&#34;Edit&#34;&gt; &lt;i class=&#34;fa fa-pencil text-inverse m-r-10&#34;&gt;&lt;/i&gt; &lt;/a&gt; &lt;a href=&#34;#&#34; data-toggle=&#34;tooltip&#34; data-original-title=&#34;Delete&#34;&gt; &lt;i class=&#34;fa fa-close text-danger&#34;&gt;&lt;/i&gt; &lt;/a&gt; &lt;/td&gt; &lt;/tr&gt; &lt;/tbody&gt; &lt;/table&gt; &lt;/div&gt; &lt;/div&gt; &lt;/div&gt; &lt;/div&gt; &lt;/div&gt; &lt;/div&gt; &lt;/div&gt; </code><pre> </pre>我尝试将角度脚本放入单击功能中,但它不起作用。 我需要的是添加后再次重新加载相同的位置。 有什么想法吗<p> </p> </question> <answer tick="false" vote="0">AngularJS 主要用于双向数据绑定,这似乎正是您正在寻找的。如果您使用 Angular,则无需使用 JQuery 来更新数据。 <p><code>$scope</code><pre> 中声明的所有变量在更改时都会自动刷新</pre> </p> <hr/>因此,您在加载角度控制器时已经发布了数据。 我会将其包含在附加到范围的函数中,因此当单击按钮时,您将发布对象并将其插入到表中。<p> </p><p></p> <div data-babel="false" data-lang="js" data-hide="false" data-console="true"> <div><code>var app = angular.module(&#39;enterprise&#39;, []); app.controller(&#39;entercontroller&#39;, function($scope, $http){ $scope.tableData = [{ text: &#34;First row&#34; }, { text: &#34;second row&#34; }]; $scope.loadData = function () { // here you do your http post var newRow = { text: &#34;New Row&#34; }; $scope.tableData.push(newRow); // do this inside your http callback function } });</code><pre> </pre><code>&lt;script src=&#34;https://ajax.googleapis.com/ajax/libs/angularjs/1.0.1/angular.min.js&#34;&gt; &lt;/script&gt; &lt;body ng-app=&#34;enterprise&#34; ng-controller=&#34;entercontroller&#34;&gt; &lt;table&gt; &lt;tr ng-repeat=&#34;row in tableData&#34;&gt; &lt;td&gt; {{row.text}} &lt;/td&gt; &lt;/tr&gt; &lt;/table&gt; &lt;button ng-click=&#34;loadData()&#34;&gt; Load data &lt;/button&gt; &lt;/body&gt;</code><pre> </pre> </div> </div><p> </p> </answer> <answer tick="false" vote="0">如果您只想在交易后刷新表中的数据列表,则可以使用此脚本。您不需要在添加按钮上添加刷新功能。在您的负载数据上使用它。<p> </p><p></p> <div data-babel="false" data-lang="js" data-hide="false" data-console="true"> <div><code>angular.module(&#39;app&#39;, []) .controller(&#39;ctrl&#39;, function($scope, $timeout) { $scope.IntervalTime = 2000; $scope.updatedData = 0; timeoutFn(); function timeoutFn() { $timeout(function() { //Add your select data query here $scope.updatedData++; timeoutFn(); }, $scope.IntervalTime); } })</code><pre> </pre><code>&lt;script src=&#34;//unpkg.com/angular/angular.js&#34;&gt;&lt;/script&gt; &lt;div ng-app=&#39;app&#39; ng-controller=&#39;ctrl&#39;&gt; &lt;table style=&#34;width:50%; height: 50%;&#34;&gt; &lt;tr&gt; &lt;th&gt;Data&lt;/th&gt; &lt;/tr&gt; &lt;tr&gt; &lt;td&gt;{{updatedData}}&lt;/td&gt; &lt;/tr&gt; &lt;/table&gt; &lt;/div&gt; &lt;style&gt; table, th, td { border: 1px solid black; text-align: center; } &lt;/style&gt;</code><pre> </pre> </div> </div><p> </p>注意:您的表格将每 2 秒刷新一次并加载更新的选择数据,因为我将其设置为 $scope。Interval 您可以根据需要更改间隔。<p> </p> </answer></body>

回答 0 投票 0

© www.soinside.com 2019 - 2024. All rights reserved.