Tag: angular

在Angular 2中操纵Dom: 我正在创建一个角度为2的Web。我有一个Jquery代码，当单击一个自定义按钮时添加2个输入和1个删除按钮，因此，当用户单击删除按钮时，它会删除输入（操纵DOM）。 Jquery代码： //Adiciona campos extra nos sócios var campos_max = 10; //max de 10 campos var x = 1; // campos iniciais $(‘#add_field’).click (function(e) { e.preventDefault(); //prevenir novos clicks if (x < campos_max) { $('#listas').append('\ \ Nome sócio:\ \ *\ \ \ \ \ Participação (%):\ \ *\ \ \ \ \ ‘); x++; } […]

使用Angular2的语义UI – 如何在组件中设置jQuery的侧栏设置？: 我有一个Angular2应用程序，我想使用Semantic UI 。但是，有一些jQuery配置如下所示我必须在加载组件后运行： $(‘#app .ui.sidebar’) .sidebar({context:$(‘#app’)}) .sidebar(‘setting’, ‘transition’, ‘overlay’) 它无法通过在index.html的head导入js文件或将其写入组件模板内的标记来实现。是否有“ typescript方式”来做到这一点或如何在组件内使用js文件？

Angular 2的JQuery .param（）方法？: 有没有像JQuery for Angular2这样的$ .param（）函数？我知道Angular 1专门提供类似Angular1等效的服务我在这里查看了Angular 2站点，他们有一个POST的演示，但他们在请求正文中发送了一个JSON。我现在的，不工作的，尝试 saveEdits() { let headers = new Headers({ ‘Content-Type’: ‘application/x-www-form-urlencoded’ }); let options = new RequestOptions({ headers: headers }); this._http.post(“ajax/update-thingy”, JSON.stringify(this.dataJson), options) .map(this.extractData) .toPromise() .catch(this.handleError); // update in Angular 1 using JQuery function // $http({ // method : ‘POST’, // url : ‘ajax/update-thingy’, // data : $.param($scope.formData), […]

ngFor之后的Angular 2火灾事件: 我正在尝试使用jQuery插件替换Angular 2中某些动态元素中的默认滚动条。这些元素是使用ngFor循环创建的，也就是说我无法将jQuery事件附加到创建的元素上。在某些时候，应用程序会改变一个Observable对象，该对象在ngFor中ngFor以呈现视图。现在，我想知道Angular何时完成绘制我的元素，以便我可以运行jQuery插件。我不想在HTML模板中包含任何javascript。我不想使用ngAfterViewInit ，因为这个钩子被触发了太多次我不想实现基于setTimeout的解决方案（我认为它不可靠）我通过使用以下自定义Pipe找到了一个解决方案：在模板的ngFor周期结束时，我写道： {{i | FireStoreEventPipe:’EVENT_TO_BE_FIRED’}} FireStoreEventPipe位置如下： transform(obj: any, args:any[]) { var event = args[0]; //Fire event return null; } 但是这个解决方案并不能让我满意。有什么更好的方法吗？谢谢

在TypeScript / Angular 4中导入jQuery插件’jquery.shorten’: 我想在使用npm的 Ionic项目中使用名为jquery.shorten的jQuery插件。 installig的命令是npm install jquery.shorten –save 。我成功地包含了jQuery ，我可以在我的项目中使用它。但是无法使用jquery.shorten 。以下是我用来包含jQuery和jquery.shorten的代码。它位于角度项目的app.module.ts中 – import * as $ from ‘jquery’; import ‘jquery.shorten’; 我在控制台看到的错误是 – 未捕获错误：找不到模块“jquery.shorten” 我也试过以下。这次所有控制台错误消失了。但我找不到使用它的方法。 import * as shortMe from ‘jquery.shorten’; 它应该用作$(“.dynamic-multiple-elements”).shorten() 。我已经遵循了一些指示来包含它。但似乎没有任何效果。我可以在node_modules看到文件夹jquery.shorten和必需的js文件。我将无法使用此解决方案，因为我的元素是动态的，而且很多。

Angular 2 datepicker组件，用于禁用特定日期: 是否有一个角度2 datepicker组件，使我能够禁用特定日期的数组？我知道为jquery datepicker创建自定义包装器是一种选择。我找到了这3个日期选择器，但似乎没有人能够禁用某些日期。 https://github.com/kekeh/mydatepicker https://github.com/jkuri/ng2-datepicker www.primefaces.org/primeng/#/calendar 编辑：我将在http请求中获取列表。另外，我需要在当前日期之前禁用所有日期。 EDIT2：这是一个预订用例。我需要在今天之前禁用所有日期，我需要禁用我将在http请求中获取的数组中的所有日期。 validation器的使用不是一个好选择，因为用户需要看到他不能选择的内容。 EDIT3：我刚刚找到这个https://github.com/valor-software/ng2-bootstrap/tree/master/components/datepicker ，我将使用这个，然后发布一个答案。

如何将bootstrap 3添加到基于Angular2 webpack的项目中: 我已经为jquery和bootstrap安装了npm包，然后在vendor.ts添加了导入，但是我仍然没有在浏览器上显示任何引导程序样式。 … import ‘jquery/dist/jquery.js’ import ‘bootstrap/dist/css/bootstrap.css’; import ‘bootstrap/dist/js/bootstrap.js’; … 我也尝试在webpack.common.js添加另一个条目，但这也没有帮助。 entry: { ‘bootstrap’: ‘./node_modules/bootstrap/dist/css/bootstrap.min.css’, ‘polyfills’: ‘./src/polyfills.ts’, ‘vendor’: ‘./src/vendor.ts’, ‘main’: ‘./src/main.browser.ts’ } 任何帮助将不胜感激，谢谢。

Angular2在焦点事件上添加类: 我想将Angular 1应用程序更新为Angular 2，并且我的旧指令存在问题。这个想法很简单。当聚焦输入字段时，应添加一个类（md-input-focus），另一个类被删除（md-input-wrapper）。然后这个过程应该在“模糊”事件上反转 – 即焦点丢失。我的旧指令只包括行 .directive(‘mdInput’,[ ‘$timeout’, function ($timeout) { return { restrict: ‘A’, scope: { ngModel: ‘=’ }, link: function (scope, elem, attrs) { var $elem = $(elem); $elem.on(‘focus’, function() { $elem.closest(‘.md-input-wrapper’).addClass(‘md-input-focus’) }) .on(‘blur’, function() { $(this).closest(‘.md-input-wrapper’).removeClass(‘md-input-focus’); }) } 等等… 我显然对我的指示有经典的开始，但已经耗尽了…..技能 import {Directive, ElementRef, Renderer, Input} from ‘angular2/core’; @Directive({ selector: […]

zone.js：140 Uncaught TypeError：无法读取属性’remove’: 我是kendo ui的新手。我在小提琴里开发了原型。删除确认窗口在那里工作正常。但当我整合我的代码库时，我收到错误无法在行pai_to_delete.remove（）中读取属性’remove’; 你能告诉我如何解决它吗？在下面提供我的代码。更新 – 我可能没有正确地解释你…当我点击链接时，我的ui看起来是一个大的弹出窗口打开了一个网格……当我点击一个列时，一个带有删除选项的小弹出窗口打开了… 。当我点击删除选项时，会打开一个确认窗口… – 当我使用原生的js确认方法时，它工作得很好..我认为那时它正确引用… – 但是当我使用kendo ui popup时它不能正常工作… – 当我使用kendo ui时，我的pai_to_delete没有正确引用…因为它指的是div而不是父div我认为是这样。原型小提琴 http://jsfiddle.net/amu6tw2a/ 整个代码我无法粘贴我的问题，所以我粘贴在小提琴，相关的代码我粘贴在下面 https://jsfiddle.net/44tLx225/ zone.js: 140 Uncaught TypeError: Cannot read property ‘remove’ of null at HTMLButtonElement.eval(swimming – jumpings.ts: 990) at HTMLDocument.dispatch(jquery – 2.2.3. js: 4737) at HTMLDocument.elemData.handle(jquery – 2.2.3. js: 4549) at ZoneDelegate.invokeTask(zone.js: 236) at […]

@HostListener OnClick for outside click在firefox中不起作用: @HostListener OnClick在firefox中不起作用。我试过onClick，onclick和onGlobalClick。他们都使用chrome，但在firefox中没有人。这是我的代码： constructor(private elRef: ElementRef, private renderer: Renderer2) { } @Output() offClick = new EventEmitter(); @HostListener(‘document:click’, [‘$event.path’]) public onGlobalClick(targetElementPath: Array) { const elementRefInPath = targetElementPath.find(e => e === this.elRef.nativeElement); if (!elementRefInPath) { this.offClick.emit(1); } }