如何替代ng-class?

时间:2017-02-18 22:42:43

标签: javascript html angularjs ionic-framework firebase-realtime-database

我正在我的离子应用程序中集成聊天,我想在数据库中显示消息后面的message.userId。

我有两个人被称为 myId (我)和 otherId (另一个人)。两者都在我的.js文件中被称为变量。

我使用此代码:

<li ng-repeat="message in messages" ng-class="{self: message.userId = myId, other: message.userId = otherId}">
                <!-- *avatar / avatar image -->
                <div class="avatar">
                    <img src="img/82.jpg">
                </div>
                <!-- *msg / messages -->
                <div class="msg">
                    <p>{{ message.text }}</p>
                    <time>
                        <i class="icon ion-ios-clock-outline"></i>
                        {{message.time}}
                    </time>
                </div>
            </li>

但是,它会将ALL消息显示为self,或将所有消息显示为other。

这是我的控制器:

.controller('Messages',['$scope', '$ionicScrollDelegate', '$timeout', '$firebaseArray', 'CONFIG', '$document', '$state', function($scope,  $ionicScrollDelegate, $timeout, $firebaseArray, CONFIG, $document, $state) {
      $scope.hideTime = false;

      var myId = firebase.auth().currentUser.uid;
      var otherId = "0LhBcBkECAXn6v12lA2rlPIsQNs2";
      var discussion = myId + otherId;

      var isIOS = ionic.Platform.isWebView() && ionic.Platform.isIOS();


      //Recieve messages
      var ref = firebase.database().ref('/messages/' + discussion);
      ref.orderByChild("timestamp").on("value", function(snapshot1) {
        console.log(snapshot1.val() + "HEY");
        $scope.messages = snapshot1.val();


      })
      window.scrollTo(0,document.body.scrollHeight);


      //Send messages
      $timeout(function(){
        $scope.sendMessage = function() {

          var d = new Date();
          var g = new Date();
          d = d.toLocaleTimeString().replace(/:\d+ /, ' ');
          g = g.toLocaleTimeString().replace(/:\d+ /, ' ') + new Date();





          $scope.sendMessages = firebase.database().ref('/messages/' + discussion).push({
            userId: myId,
            text: $scope.data.message,
            time: d,
            timestamp: g
          });

          console.log($scope.messages);

          delete $scope.data.message;
          $ionicScrollDelegate.scrollBottom(true);

        };

        $scope.inputUp = function() {
          if (isIOS) $scope.data.keyboardHeight = 216;
          $timeout(function() {
            $ionicScrollDelegate.scrollBottom(true);
          }, 300);

        };

        $scope.inputDown = function() {
          if (isIOS) $scope.data.keyboardHeight = 0;
          $ionicScrollDelegate.resize();
        };

        $scope.closeKeyboard = function() {
          // cordova.plugins.Keyboard.close();
        };
        $scope.data = {};
        $scope.myId = myId;
        $scope.otherId = otherId;
        $scope.messages = [];



      })

    }]);

有什么想法吗?

1 个答案:

答案 0 :(得分:2)

您正在使用=表达式中的单一等级ng-class

<li ng-class="{self: message.userId = myId, other: message.userId = otherId}">

这是作业,而不是测试!使用双重或三重相等:

<li ng-class="{self: message.userId === myId, other: message.userId === otherId}">