EmberJS - Áreas de texto del asistente de entrada de plantillas

Es un campo de formulario de texto de varias líneas donde un usuario puede ingresar un número ilimitado de caracteres. El área de texto vincula el valor del texto al contexto actual.

El {{textarea}} admite las siguientes propiedades:

value
name
rows
cols
placeholder
disabled
maxlength
tabindex
selectionEnd
selectionStart
selectionDirection
wrap
readonly
autofocus
form
spellcheck
required

Sintaxis

{{textarea value = name cols = "width_of_textarea" rows = "number_of_lines"}}

Ejemplo

El ejemplo que se muestra a continuación especifica el control de entrada de texto de varias líneas para introducir un número ilimitado de caracteres. Cree una ruta con el nombre textarea y abra el archivo router.js para definir las asignaciones de URL:

import Ember from 'ember';
import config from './config/environment';

const Router = Ember.Router.extend ({
   location: config.locationType,
   rootURL: config.rootURL
});

Router.map(function() {
   this.route('textarea');
});

export default Router;

Abra el archivo application.hbs creado en app / templates / con el siguiente código:

<h2>Input Helper Textarea</h2>
{{#link-to 'textarea'}}Click Here{{/link-to}}
{{outlet}}

Al hacer clic en el enlace, la página debería abrir el archivo textarea.hbs , que contiene el siguiente código:

Enter text here: <br/><br/>{{textarea value = name cols = "15" rows = "5" 
   placeholder = "Message"}}<br/>
<button {{action "send"}}>Send</button>
{{outlet}}

Abra el archivo textarea.js creado en app / routes / con el siguiente código:

import Ember from 'ember';

export default Ember.Route.extend({
   model: function () {
      return Ember.Object.create ({
         name: null
      });
   }
});

Ahora abra el archivo textarea.js creado en app / controllers / con el siguiente código:

import Ember from 'ember';

export default Ember.Controller.extend({
   actions: {
      send: function () {
         document.write('Entered text is: ' + this.get('name'));
      }
   }
});

Salida

Ejecute el servidor ember; recibirá el siguiente resultado:

Al hacer clic en el enlace, se mostrará un área de texto, ingrese el texto y haga clic en el botón enviar -

Ahora haga clic en el botón enviar, mostrará el resultado como se muestra en la captura de pantalla a continuación:

↰ Previous page