angularjs 相关问题

将字节数组输出转换为 Blob 会损坏文件

我正在使用 Office Javascript API 来使用 Angular 编写 Word 插件。 我想通过 API 检索 Word 文档，然后将其转换为文件并通过 POST 上传到服务器。

AngularJS 自定义指令和控制器方法不起作用，并且在 Chrome 浏览器中无法到达断点

AngularJS 自定义指令和控制器方法附加到 md-fab 滚动返回顶部按钮。一旦页面向下滚动，md-fab 按钮就会变得可见，并在页面响应时隐藏...

Angular-ui-grid 分页控件未显示

我使用以下控制器和 HTML 配置来创建分页的 ui 网格： app.controller('AdminProspectGridCtrl', function ($scope, $http, uiGridConstants) { $范围。

$index 对于所有使用 dir-paginate 的页面都是固定的

我在我的 Angular 应用程序中使用 dirPaginate 指令进行分页。 它工作正常，但问题是我每页显示 10 条记录，但每个页面上的 $index 都重复相同的（1-10）...

类型错误：无法读取未定义的属性“核心”

我在尝试将数据绑定到数据网格选项时遇到问题。我读到刷新将有助于加载数据，但是当我添加逻辑时它会出错。 HTML 代码： 我在尝试将数据绑定到数据网格选项时遇到问题。我读到刷新将有助于加载数据，但是当我添加逻辑时它会出错。 HTML代码： <div ng-controller="MainCtrl"> <br /> <b>{{msg}}</b> <div id="grid1" ui-grid="gridOptions" class="grid" ui-grid-pagination></div> </div> JavaScript 代码： var app = angular.module('app', ['ngTouch', 'ui.grid', 'ui.grid.edit', 'ui.grid.pagination']); app.controller('MainCtrl', function($scope, $filter, $http, $timeout) { $scope.gridOptions = { enableSorting: true, enableRowSelection: true, enableRowHeaderSelection: false, enableFiltering: true, selectionRowHeaderWidth: 35, rowHeight: 35, multiSelect: true, enableGridMenu: true, columnDefs: [ { name: 'client' }, { name: 'qa_ver' }, { name: 'qa_build_no' }, { name: 'qa_build_date' }, { name: 'prod_ver' }, { name: 'prod_build_no' }, { name: 'prod_build_date' }, { name: 'prod_deploy_date' }, { name: 'deploy_src' } ], data: 'jsonData', paginationPageSizes: [5, 10, 25, 50], paginationPageSize: 5, } $timeout(function() { getJSONData(); $scope.data = jsonData; $scope.gridOptions.data = $scope.data; }, 3000); $scope.gridOptions = { onRegisterApi: function(gridApi){ $scope.gridApi = gridApi;} } $scope.gridApi.core.refresh(); 抛出错误： TypeError: Cannot read property 'core' of undefined at new <anonymous> (dashboard.html:114) at Object.invoke (angular.js:4625) at $controllerInit (angular.js:10027) at nodeLinkFn (angular.js:8965) at compositeLinkFn (angular.js:8333) at compositeLinkFn (angular.js:8336) at compositeLinkFn (angular.js:8336) at publicLinkFn (angular.js:8213) at angular.js:1715 at Scope.$eval (angular.js:17025) 我认为正确的形式应该是： $scope.gridOptions = { enableSorting: true, enableRowSelection: true, enableRowHeaderSelection: false, enableFiltering: true, selectionRowHeaderWidth: 35, rowHeight: 35, multiSelect: true, enableGridMenu: true, columnDefs: [ { name: 'client' }, { name: 'qa_ver' }, { name: 'qa_build_no' }, { name: 'qa_build_date' }, { name: 'prod_ver' }, { name: 'prod_build_no' }, { name: 'prod_build_date' }, { name: 'prod_deploy_date' }, { name: 'deploy_src' } ], onRegisterApi: function(gridApi){ $scope.gridApi = gridApi; } data: 'jsonData', paginationPageSizes: [5, 10, 25, 50], paginationPageSize: 5, } $timeout(function() { getJSONData(); $scope.data = jsonData; $scope.gridOptions.data = $scope.data; }, 3000); $scope.gridApi.core.refresh(); .. .. . }

如何解决奇数编号的 Node.js 版本不会进入 LTS 状态且不应用于生产节点：16120 UnhandledPromiseRejectionWarning

我尝试创建一个新的角度应用程序ng新应用程序，但出现此错误 检测到 Node.js 版本 v11.0.0。 奇数编号的 Node.js 版本不会进入 LTS 状态，并且不应用于产品...

有角度的手表未发射

有 1 个 Angular 应用程序，带有 1 个父控制器和一个子控制器。 child中，OBJ-CHILD有1个$watch WATCH-CHILD，触发$emit。 在父级中，有一个监听器...

通过 ng-bind-html 使用插入的 HTML 中的函数

我从数据库中获取了一个 HTML 字符串，我想通过 ng-bind-html 将其插入到我的 AngularJs 应用程序中。我是这样做的： HTML： <... 我从数据库中获取了一个 HTML 字符串，我想通过 ng-bind-html 将其插入到我的 AngularJs 应用程序中。我是这样做的： HTML： <div ng-bind-html="myBindHtml"></div> JavaScript： $scope.myBindHtml = $sce.trustAsHtml(htmlStringToInsert); 我的 HTML（我想插入）看起来像这样： <button ng-click="testClickEvent()">TestButton</button> 插件工作正常。 现在我编写了一个按钮应该调用的函数（testClickEvent）。这只是将一个字符串输出到控制台。 但这部分不起作用。我猜想我插入的 HTML 与该函数没有绑定。有什么办法可以调用我的函数吗？ Angular 代码仅当您在 Angular 上下文中运行时才会执行。当您使用 ng-bind-html 时，它会在 Angular 上下文之外生成，因此像 ng-click 这样的 Angular 事件不起作用，您需要依赖像 onclick 这样的纯 JS 事件，因此请避免使用这些场景，而直接在 Angular 上进行编码，因为解决方案的复杂性！ 当需要角度事件并且我们需要直接在前端编码而不是从数据库或其他方法输入时，我们可以避免ng-bind-html var app = angular.module('myApp', []); app.controller('myCtrl', function ($sce, $scope) { $scope.items = []; for (var i = 1; i <= 2; i++) { $scope.items.push({ description: $sce.trustAsHtml('<h2 onclick="console.log(\'hello\')">with onclick item ' + i + '</h2>') }); }; $scope.items2 = []; for (var i = 1; i <= 2; i++) { $scope.items.push({ description: $sce.trustAsHtml('<h2 ng-click="console.log(\'hello\')"> with ng-click item ' + i + '</h2>') }); }; }); <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.8.3/angular.min.js" integrity="sha512-KZmyTq3PLx9EZl0RHShHQuXtrvdJ+m35tuOiwlcZfs/rE7NZv29ygNA8SFCkMXTnYZQK2OX0Gm2qKGfvWEtRXA==" crossorigin="anonymous" referrerpolicy="no-referrer"></script> <div ng-app="myApp"> <div ng-controller="myCtrl"> <div> <div ng-repeat="item in items" ng-bind-html="item.description"></div> </div> <hr /> <div> <div ng-repeat="item in items2" ng-bind-html="item.description"></div> </div> </div> </div>

如何控制列表元素抛出键盘事件

https://stackblitz.com/edit/react-o1ra7c 用户搜索结果后，用户尝试使用键盘事件箭头需要向下移动。 https://stackblitz.com/edit/react-o1ra7c 用户搜索结果后，用户尝试使用键盘事件箭头需要向下移动。 <div> <input onChange={handleSearchChange}/> <div css={countryDataCss}> {countryList?.map((country) => ( <div key={country.countryCode}> <span css={countryCss}>{country.countryName}</span> <span css={countryDialCodeCss}> {country.countryDialNo} </span> </div> ))} </div> </div> 您可以使用 javascirpt 事件 onkeydown，对于 React 来说是 onKeyDown，它提供了所需的行为，请检查下面的 stackblitz！ import React from 'react'; import './style.css'; import { useState } from 'react'; export default function App() { const [searchText, setSearchText] = useState(''); const [selectedCountry, setSelectedCountry] = useState('SG'); const [activeIndex, setActiveIndex] = useState(0); const [selectedDialCode, setSelectedDialCode] = useState('+65'); const countryCodeListResponse = [ { countryCode: 'IND', countryDialNo: '+91', countryName: 'India' }, { countryCode: 'SG', countryDialNo: '+65', countryName: 'Singpare' }, ]; const [countryList, setCountryList] = useState(countryCodeListResponse); function handleSearchChange(e) { const searchText = e.target.value.toLowerCase(); if (countryCodeListResponse) { const updatedList = countryCodeListResponse .filter((el) => el.countryName.toLowerCase().includes(searchText)) .sort( (a, b) => a.countryName.toLowerCase().indexOf(searchText) - b.countryName.toLowerCase().indexOf(searchText) ); setSearchText(searchText); setCountryList(updatedList); } } const onSelectCountry = (code, dialCode) => { setSelectedCountry(code); setSelectedDialCode(dialCode); setSearchText(''); setCountryList(countryCodeListResponse); }; const onKeyDown = (event) => { console.log(event); switch (event.keyCode) { case 38: // arrow up if (activeIndex > 0 && activeIndex <= countryList.length - 1) { setActiveIndex((prev) => prev - 1); } break; case 40: // arrow down if (activeIndex >= 0 && activeIndex < countryList.length - 1) { setActiveIndex((prev) => prev + 1); } break; case 13: const country = countryList[activeIndex]; onSelectCountry(country.countryCode, country.countryDialNo); break; default: break; } }; return ( <div class="dropdown"> <div class="search"> <div> <span>{selectedCountry}</span> <span>{selectedDialCode}</span> </div> <input class="search-input" onKeyDown={(e) => onKeyDown(e)} placeholder="Search" value={searchText} onChange={handleSearchChange} /> </div> <div class="list"> {countryList?.map((country, index) => ( <div onKeyDown={(e) => onKeyDown(e)} className={index === activeIndex ? 'active' : ''} tabIndex="0" key={country.countryCode} onClick={() => onSelectCountry(country.countryCode, country.countryDialNo) } > <span>{country.countryName}</span> <span>{country.countryDialNo}</span> </div> ))} </div> </div> ); } 堆栈闪电战

在 codeigniter 中启用 cors（restserver by @chriskacerguis）

http.get 请求工作正常。 当 api 移动到服务器时，出现了问题。 客户端使用 angularJs $http.get('http://example.com...

如何使用旧的 angularJS 1.5.5 应用程序

我必须使用旧的 AngularJS 1.5.5 应用程序进行维护，但我不知道如何为其设置一个好的环境。 我应该安装哪个版本的 NodeJS/NPM 才能使其与 gulp 一起工作......

如何将 ionic 应用程序作为网站托管在服务器上

我使用 ionic 和 Cordova 创建了 Android 移动应用程序。现在我需要将此应用程序作为网站托管。我对托管网络应用程序没有任何了解。请帮忙。

如何使用 Angular JS 双击按钮执行操作

使用这个我正在检查右键单击我的按钮如何检查双击我的按钮 ` app.directive('rightClick', function ($parse, $mdMenu) { 返回函数（范围、元素...

如何在 Angular 中创建面包屑

我想将面包屑添加到我的页面。我有很多条路线，但没有一条有孩子。 我尝试通过创建一个子项来做到这一点，但是有太多到公共页面的重定向。例如; 首页 >

Render2 无法在 Angular 基本项目中工作

我有一个角度应用程序 Angular-tour-of-heroes ，其结构如下： 源代码 ->应用程序 ->你的组件 ->your-component.component.html ...

类型“Window & typeof globalThis”上不存在属性“MSStream”

类型“Window & typeof globalThis”上不存在属性“MSStream” 嗨堆栈社区。我使用了这行代码，因为我想知道我是在 PC、Android 还是 ios 上工作。它是

如何禁用日期选择器角度中的过去日期

我有一个带有日期选择器的输入字段。我需要用户仅从当前日期选择日期，而过去的日期不应单击。下面是代码。 我有一个带有日期选择器的输入字段..我需要用户仅从当前日期选择日期，过去的日期不应该可单击..下面是代码。 <div class="col-lg-4"> <input class="form-control" type="datetime" date-time auto-close="true" view="date" min-view="date" maxlength="10" format="dd/MM/yyyy" ng-model="$ctrl.DateInput" placeholder="renewal date" required="true"> </div> 感谢快速帮助.. 谢谢！ <input class="form-control m-input pl-6" type="date" [min]="todayDate"formControlName="dateValidity"> 最小和最大是用于验证输入范围的日期属性，这些属性将禁用日历弹出窗口上的之前和之后的日期。 在你的 ts 中定义最短日期 todayDate=this.datePipe.transform(new Date(), 'yyyy-MM-dd'); 代码： <html> <head> <link href="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css" rel="stylesheet"> <script language="javascript" src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.7/angular.js"></script> <script language="javascript" src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.7/angular-animate.js"></script> <script language="javascript" src="http://angular-ui.github.io/bootstrap/ui-bootstrap-tpls-0.14.3.js"></script> </head> <body style="Padding:20px;"> <form> <div ng-app="myApp" ng-controller="myCntrl"> Date: <input type="text" uib-datepicker-popup="{{dateformat}}" min-date="mindate" ng-model="dt" is-open="showdp" /> <span> <button type="button" class="btn btn-default" ng-click="showcalendar($event)"> <i class="glyphicon glyphicon-calendar"></i> </button> </span> </div> <script language="javascript"> angular.module('myApp', ['ngAnimate', 'ui.bootstrap']); angular.module('myApp').controller('myCntrl', function ($scope) { $scope.today = function () { $scope.dt = new Date(); }; $scope.mindate = new Date(); $scope.dateformat="MM/dd/yyyy"; $scope.today(); $scope.showcalendar = function ($event) { $scope.showdp = true; }; $scope.showdp = false; }); </script> </form> </body> </html> 工作为： 如果您想缩小可能日期的范围，请添加最小日期或最大日期，如示例中所示。 http://plnkr.co/edit/QiQDiPXhuO0eTPxxdGnd?p=preview 以下是文档的相关部分： https://angular-ui.github.io/bootstrap/#/datepicker max-date（默认：null）-定义最大可用日期。 min-date（默认值：null）- 定义最小可用日期。 您可以通过结合使用 HTML 和 TypeScript 来禁用 Angular 中 datetime-local 类型的 HTML 5 输入中的过去日期。 组件.html <input type="datetime-local" min="{{dateToday() | date:'yyyy-MM-ddTHH:mm:ss.sss'}}" /> 我们使用 min 属性将允许的最小日期设置为当前日期和时间。 minDate() 函数以与 datetime-local 输入类型兼容的格式返回当前日期和时间。您可以修改它以满足您的需求。 组件.ts dateToday(): Date { const now = new Date(); const year = now.getFullYear(); const month = now.getMonth() + 1; const day = now.getDate(); const hour = now.getHours(); const minute = now.getMinutes(); return new Date(year, month, day, hour, minute); } 此函数返回一个 Date 对象，表示当前日期和时间，但秒和毫秒设置为零。这可确保最小日期是当前分钟的开始，而不是用户加载页面的确切时刻。 datetime-local 输入仅允许用户选择从当天开始的未来日期和时间。 我希望这对这篇文章的新访客有所帮助。 在你的 ts 文件中添加 minDate = 新日期(); 在角度 16 并导入MatInputModule 在 html 中只需在输入中添加 [min]="minDate" <div class="tagus-form-group without-icon"> <mat-form-field appearance="fill"> <mat-label>End date</mat-label> <input [min]="minDate" matInput [matDatepicker]="endDatePicker" formControlName="endDate" /> <mat-datepicker-toggle matSuffix [for]="endDatePicker"></mat-datepicker-toggle> <mat-datepicker #endDatePicker></mat-datepicker> </mat-form-field> </div>

在日期选择器 AngularJS 上使用 ng-change

我正在创建一个网络应用程序，我想在我的日期选择器文本框的 ng-change 上在控制台中显示日期 这是我的代码 输入日期 &l... 我正在创建一个网络应用程序，我想在我的日期选择器文本框的 ng-change 上在控制台中显示日期 这是我的代码 <div class="form-group"> <h3>Enter Date</h3> <div id="datepicker" class="input-group date" data-date-format="dd-mm-yyyy"> <span class="input-group-addon"><i class="glyphicon glyphicon-calendar"></i></span> <input class="form-control" ng-model="mddate" ng-blur="chngDate(mddate)" type="text" readonly /> </div> <style> label { margin-left: 20px; } #datepicker { width: 180px; margin: 0 20px 20px 20px; } #datepicker > span:hover { cursor: pointer; } </style> <script> $(function () { $("#datepicker").datepicker({ autoclose: true, todayHighlight: true }).datepicker('update', new Date());; }); </script> </div> 但问题是 ng-change 不能与 bootstrap datepicker 一起使用， 这是我在控制器中的功能 $scope.chngDate = function (date) { var dates = new Date(); console.log(dates); } 我尝试在特定文本框上使用 $watch 函数，但这也不起作用 $scope.$watch('mddate', function (newValue, oldValue) { console.log('oldValue=' + oldValue); console.log('newValue=' + newValue); //do something }); 这首先显示未定义的值，然后该函数未执行 我需要做什么？ 使用 ng-blur 而不是 ng-change，它对我有用 尝试 date-change="chngDate()"

在控制台中打印但请求成功时，Angular $http 响应返回 null

我有一个用 Spring 开发的本地 Web 服务，一切正常（使用浏览器或 Postman），但是当我尝试使用 Angular/Ionic 的简单 GET 方法时，它在响应中返回 null。 但当我...

github 操作 - 后台 Angular 服务

我有这个github操作 - https://github.com/gctools-outilsgc/gccollab-frontend/blob/4aa9eaabbf3b4a166f2b4a5d3ad6cb2a84eca25f/.github/workflows/e2e-test.yml 由于某种原因，它只是有时有效...