All geek questions in one place

Ng-click Missing getter for 'clickHandler' in AngularDart

Trying to get a simple click handler will turn out to be pretty annoying. An application is just a test application for testing various Angular.Dart functions. - Using Dart 1.6 and Angular 1.0 and launching in Dartium -

Clicking the button causes an error. Ng-click Missing getter for 'clickMe'. But data binding to input and label works fine.

Code example

import 'package:angular/angular.dart'; import 'package:angular/application_factory.dart'; class TestMod extends Module { TestMod() { bind(ToggleComponent); } } @Component(selector: 'toggle-comp', templateUrl: "test.html", publishAs: 'toggle') class ToggleComponent { String name = ""; @NgTwoWay('rating') int rating; ToggleComponent() { } void clickMe() { print("Click"); } } void main() { applicationFactory() ..addModule(new TestMod()) ..run(); }

test.html file - where the binding works for the ng model, but not for the ng-click

 <div> <h3>Hellos {{name}} {{rating}}!</h3> Name: <input type="text" ng-model="name"> <button ng-click="clickMe()">Click me</button> </div>

and finally here is the index.html file

 <!DOCTYPE html> <html ng-app > <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>AngularDartTest</title> <script async type="application/dart" src="main.dart"></script> <script async src="packages/browser/dart.js"></script> <link rel="stylesheet" href="assets/main.css"> </head> <body> <toggle-comp rating="5"></toggle-comp> </body> </html>

Stacktrace when you press the button

 No getter for 'clickMe'. STACKTRACE: #0 StaticClosureMap.lookupGetter (package:angular/core/parser/static_closure_map.dart:14:25) #1 StaticClosureMap.lookupFunction (package:angular/core/parser/static_closure_map.dart:25:26) #2 ClosureMapLocalsAware.lookupFunction.<anonymous closure> (package:angular/core/parser/parser.dart:253:44) #3 CallScope.eval (package:angular/core/parser/eval_calls.dart:27:25) #4 _UnwrapExceptionDecorator.eval (package:angular/core/parser/parser.dart:117:30) #5 BoundExpression.call (package:angular/core/parser/syntax.dart:59:36) #6 NgEvent._initListener.<anonymous closure> (package:angular/directive/ng_events.dart:142:39) #7 _rootRunUnary (dart:async/zone.dart:840) #8 _ZoneDelegate.runUnary (dart:async/zone.dart:466) #9 _onRunUnary.<anonymous closure> (package:angular/core/zone.dart:122:63) #10 VmTurnZone._onRunBase (package:angular/core/zone.dart:104:16) #11 _onRunUnary (package:angular/core/zone.dart:122:17) #12 _CustomZone.runUnary (dart:async/zone.dart:748) #13 _CustomZone.runUnaryGuarded (dart:async/zone.dart:656) #14 _CustomZone.bindUnaryCallback.<anonymous closure> (dart:async/zone.dart:682)
+5
source share
2 answers

The problem is that the angular transformer is having trouble finding test.html, so it doesn't get getMe getMe. Getters are only generated if we see a character in an expression in a template.

By the getter method, I mean the display of "clickMe": (o) => o.clickme . You can always check all recipients / setters generated by us in main_static_expressions.dart .

The transformer should be fixed (PRs are welcome), but at the same time there are several ways to get the generator to generate:

  • use exportExpressions. docs
  • use html_files in pubspec.yaml. docs
  • put your component and its template in the lib directory.

PS In Angular.dart v1.0 publishAs does nothing, because the context of evaluating the expression is the component itself. docs

+7
source

I don’t know why name works, but I think that "toggle.clickMe()" will work or remove the publishAs argument.

0
source

Source: https://habr.com/ru/post/1204539/

More articles:


All Articles