AngularJsのバインド値が表示されない

Question

{{}}で要素値を更新しようとしています。ここに私のHTMLがあります。

<section id="eee" ng-controller="DiagCtrl" <input type="hidden" id="lst" name = "lst" value="{{process_list(lst)}}">> 
    <h2><a href="#eee">EEE</a></h2> 
    <div id="paper" ></div> 
    <div id="tt" ng-model="toolTip" ><span >{{toolTip}}</span > </div> 
    </section> 

on mouseoverイベントコントローラを呼び出します。

paper.on('cell:mouseover', 
    function(cellView, evt) { 
     var t = cellView.model.attributes.attrs.text.text; 
     angular.element(document.getElementById("eee")).scope().setTooltip(t); 
     cellView.model.attributes.attrs.title = t; 
    } 
); 

{{ツールチップが}}もmouseverイベント後に設定されないコントローラ

app.controller("DiagCtrl", function ($scope, getApiDataService) { 
    $scope.lst = []; 
    $scope.toolTip = []; 
    $scope.setTooltip = function (table) { 
     $scope.toolTip = table; 
    } 
    $scope.process_list = function (list) { 
     add_cell(list); 
    } 
}); 

。私はここで何が欠けているのですか？

Answer 1

ng-model指示は<div>タグでは機能しません。それは<input>と<select>タグで動作します。

マウスオーバーで何かを設定するには、ng-mouseoverディレクティブを使用します。

<span ng-mouseover="setToolTip('hello')">{{toolTip}}</span > 

JS

$scope.setTooltip = function (table) { 
    $scope.toolTip = table; 
};