用動態生成的鏈接動態更新html

我的應用程序生成一個單詞列表並將這些單詞轉換爲鏈接。我希望用戶能夠點擊這些鏈接並將該詞用作搜索詞。如何從HTML鏈接檢索{{word.name}}？如果點擊鏈接，我不希望它生成新的頁面。我只是想能夠檢索鏈接中的文字。用動態生成的鏈接動態更新html

HTML：

<li> 
     <a ng-href="...">{{ word.name }}</a> 
    </li>

Controller.js

$scope.search = function() { 
    $http.post('*', $scope.formData) 
     .success(function(data) { 
      $scope.formData  = {}; 
      $scope.word  = data; 
     }) 
     .error(function(data) { 
      console.log('Error: ' + data); 
     }); 
};

Node.js的服務器代碼：

app.get('*', function(req, res) 
    { 
     //get the {{ word.name }} from the HTML and use it to search 
     //sql = select.....+word.name; 
     connection.query(sql, function (err, result, fields) 
     { 
     if(err) throw err; 
     res.json(result); 
     }); 
    });

來源

2014-06-05 Soubriquet

你需要把這個詞的形式的POST數據。

當您發佈帖子請求時，您會在服務器上發佈一些數據。你通常你是這樣的：

<form action="yourfile.php" method="post"> 
    <input type="text" name="key_word" value="Search a word ..."> 
    <input type="submit" value="Search"> 
</form>

這將張貼到yourfile.php數據key_word = theValueOfInput

與JavaScript中使用這樣做：

<form id="myForm" action="yourfile.php" method="post"> 
    <input type="text" id="key_word" name="key_word" value="Search a word ..."> 
    <input type="submit" value="Search"> 
</form> 
<script> 
    function postMe(word){ 
     document.getElementById("key_word").value=word; 
     document.getElementById("myForm").submit(); 
    } 
</script> 

<a onclick="postMe(this.innerHTML)">yourWord1Here</a> 
<a onclick="postMe(this.innerHTML)">yourWord2Here</a> 
<a onclick="postMe(this.innerHTML)">yourWord3Here</a> 
...

例子：http://jsfiddle.net/Lyudj/2/

來源

2014-06-05 01:11:44 DarkThanos

我不知道你的意思。你能澄清嗎？ – Soubriquet

但是這是來自html方面。在服務器上，您必須檢索數據。 – DarkThanos

您可以嘗試

<li> 
     <a href="#" ng-click="searchWord=word.name">{{ word.name }}</a> 
</li>

而且對JS

$scope.search = function() { 
    $http.post('*', $scope.searchWord) 
     .success(function(data) { 
      $scope.formData  = {}; 
      $scope.word  = data; 
     }) 
     .error(function(data) { 
      console.log('Error: ' + data); 
     }); 
};

來源

2014-06-05 05:25:57 Paras

用動態生成的鏈接動態更新html

回答

相關問題