update docs and message on template arrow and bind

docs/rules/no-template-arrow.md

@@ -7,14 +7,31 @@ loss.
 Instead, you should do something like so:
 
 ```ts
-_render() {
-  return html`<x-foo @event=${this._onClick}>`;
-}
+class MyElement extends LitElement {
+  render() {
+    return html`<x-foo @event=${this._onClick}>`;
+  }
 
-_onClick() { ... }
+  _onClick() { ... }
+}
 ```
 
-As lit will automatically bind it to the correct context.
+As LitElement will automatically bind event listeners to the correct context, or:
+
+```ts
+class MyElement extends LitElement {
+  constructor () {
+    super();
+    this.someFunc = this.someFunc.bind(this);
+  }
+
+  render() {
+    return html`<x-foo .funcProp=${this.someFunc}>`;
+  }
+
+  someFunc() { ... }
+}
+```
 
 ## Rule Details
 

docs/rules/no-template-bind.md

@@ -7,14 +7,32 @@ loss.
 Instead, you should do something like so:
 
 ```ts
-_render() {
-  return html`<x-foo @event=${this._onClick}>`;
+class MyElement extends LitElement {
+  render() {
+    return html`<x-foo @event=${this._onClick}>`;
+  }
+
+  _onClick() { ... }
 }
+```
+
+As LitElement will automatically bind event listeners to the correct context, or:
 
-_onClick() { ... }
+```ts
+class MyElement extends LitElement {
+  constructor () {
+    super();
+    this.someFunc = this.someFunc.bind(this);
+  }
+
+  render() {
+    return html`<x-foo .funcProp=${this.someFunc}>`;
+  }
+
+  someFunc() { ... }
+}
 ```
 
-As lit will automatically bind it to the correct context.
 
 ## Rule Details
 

src/rules/no-template-arrow.ts

@@ -19,9 +19,9 @@ const rule: Rule.RuleModule = {
     },
     messages: {
       noArrow:
-        'Arrow functions must not be used in templates, ' +
-        'a method should be passed directly like `${this.myMethod}` as it ' +
-        'will be bound automatically.'
+        'Arrow functions should not be used in templates. ' +
+        'LitElement event bindings are bound automatically, ' + 
+        'otherwise a method/function should be bound outside the render method (e.g. in the constructor) beforehand'
     }
   },
 

src/rules/no-template-bind.ts

@@ -20,8 +20,7 @@ const rule: Rule.RuleModule = {
     messages: {
       noBind:
         '`.bind` must not be used in templates, ' +
-        'a method should be passed directly like `${this.myMethod}` as it ' +
-        'will be bound automatically.'
+        'a method should be bound once in the constructor and passed directly like `${this.myMethod}`.'
     }
   },