2016-12-27 4 views
2

私は角度とfirebaseを使ってアプリを作っています。私はユーザーが自分の記事を投稿できるようにangle-trixエディタを実装したいと思います。しかし、私は角度トリックスをどのように統合するのか分かりません。私はjsファイルを含んでおり、app.jsに 'angularTrix'を注入しました。 var app = angular.module('myApp', ['ngRoute', 'ui.bootstrap', 'ngAnimate', 'firebase', 'ngSanitize','angularTrix']); これは私のhtmlページです。anglejs firebaseアプリにangle trixを追加

<div> 
<trix-editor ng-model="trix" angular-trix></trix-editor> 
<button ng-click="save()">Save!</button></div> 

、これは私がコントローラに含める必要がわからないコントローラ

app.controller('profileCtrl', ['$scope', "$routeParams", "$firebaseObject", "$sce", "Auth", function($scope, $firebaseObject, $routeParams, $rootScope, Auth, $sce) { 
// Demo controller 
console.log('In ctrl'); 

$scope.trix = '<p>Hello</p>'; 
$scope.save = function() { 
    alert($scope.trix); 
};}]); 

Result です。ユーザーが送信ボタンを押すと、HTMLを抽出してfirebaseに保存する必要があります。

私はFirebaseにデータを保存する方法を知っていますが、AngularTrixからHTMLを抽出する方法は分かりません。

コントローラのコードのスニペットが助けになるでしょう。

答えて

1

内側のHTMLは、あなたがこのようng-model属性を通じてエディタに渡すモデルに格納されています。ここでは

<trix-editor angular-trix ng-model="foo"></trix-editor> 

fooは、あなたのマークアップを持っているでしょう:

angular.module('trixDemo', ['angularTrix']).controller('trixDemoCtrl', function($scope) { 
    $scope.foo = '<div>Hello world!</div>'; 
}); 

Demo

+0

これは機能しません。このページには何も表示されません。 –

+0

私のデモは動作していませんか? –

+0

これは、データが入っていない小さなボックスを表示しているだけです。 –

関連する問題